html - 块显示的 CSS 大纲错误

Question

我正在尝试在 html 和 CSS 中创建一个组合框，其中每个项目都位于单独的行上，并且当您将鼠标悬停在其上时，每行都会亮起蓝色，就像在 Google 上一样。这很容易。我有一个divwith links( a) in，每个链接display:block在 CSS 中使用来填充整个div. 然后我为悬停的那个添加了一个虚线轮廓，这就是事情变得奇怪的地方。

这是jsFiddle。

如果您将鼠标悬停在顶部链接上，您可以看到它正在工作，但其他链接似乎没有显示轮廓......向下的第二个链接在底部可见，但其他链接根本不存在。

任何帮助，将不胜感激。

编辑：我在 Windows XP 上使用 IE8

Answer 1

http://www.w3schools.com/cssref/pr_outline.asp

“注意：IE8 仅在指定了 !DOCTYPE 时才支持大纲属性。”

如果您在 IE9 中使用兼容模式进行测试，请确保您的文档模式符合 Internet Explorer 8 标准，而不是 Quirks。如果我将我的切换到 Quirks 模式，轮廓就会消失。