Javascript 删除默认ui超链接行为

我制作了一个搜索框，它使用jQuery UI自动完成功能来显示潜在的搜索匹配。我注意到，当鼠标悬停时，下拉列表中的

a

s会将UI菜单移动并缩小几个像素。是否有办法防止出现这种情况，即菜单链接上显示的唯一样式是我通过以下方式添加的颜色更改：

.ui-menu .ui-menu-item a:hover{
  background:none;
  color:#FF0000;
  font-size:10px;
}

---

以下是我迄今为止的进展情况

因此，当您将鼠标悬停在下拉列表中的某个项目上时，jQuery ui会在您的元素上添加一个

ui状态焦点

类，该类具有以下css属性：

.ui-state-focus {
     font-weight: normal;
     margin: -1px;
 }

您看到字符跳跃的原因是

边距：-1px。如果您使用其他内容覆盖该css类，则可以消除跳转文本

因此，为了修复此问题，您可以执行以下操作：

.ui-menu .ui-menu-item a.ui-state-focus {
  margin: 0px;
}

注意，我添加了其他CSS选择器，以便获得一定程度的特殊性来覆盖jQueryUI的样式。这是一个更新的JSFIDLE:
你的小提琴不工作我尝试将边距更改为不同的值，但似乎没有任何效果。@CodeFander我用更多的细节和更新的小提琴更新了我的答案。您的更改可能不起作用的原因是您在CSS选择器上没有足够的特殊性