javascript - 焦点模糊上的 MS Edge 轮廓伪影？

Question

我<a>在一个简单的弹出菜单中有一系列垂直的元素。对于 a11y，我已经连接了键盘事件，并且我正在使用 jQuery 来 focus() the <a>'s. ' <a>s 由 React 呈现，但它们的处理程序是通过 jQuery 附加的。一些 css 定义了<a>具有 2px 轮廓的焦点样式。只有在 MS Edge 中，当我移动焦点时，先前聚焦的<a>有一条水平 1px 伪影线，与<a>. 将焦点移到较低/下一个<a>会导致伪影出现在先前聚焦的顶部<a>，将焦点移到更高/上<a>会导致伪影出现在先前聚焦的下方<a>. 我已经使用 Edge 的开发人员面板来应用伪类并为受影响<a>的对象设置各种大纲规则 - 工件仍然存在。这些<a>也有边界：0。有任何想法吗？

标签： javascriptjquerycssreactjsmicrosoft-edge

Answer 1

好吧，我对包含无序列表和链接的 div 应用了行高规则。当我禁用该规则时，没有更多的工件。我将把它留在那里......我不确定哪些交互/间距规则可以互操作，但由于问题已解决，就是这样。