IE偏移并忽略锚点焦点轮廓的高度宽度？

IE偏移并忽略锚点焦点轮廓的高度/宽度？

您尚未调整元素的

display

属性

a

，因此即使它们“包含”了块级

div

元素，它们仍然显示内联。结果符合CSS2.1规范的这一部分其中描述了包含块子级的内联应该如何表现。

没有一个浏览器会自动调整显示模式，但是Chrome似乎正在做的是猜测其默认轮廓的位置，并根据其最佳猜测进行绘制。但是，关于此的真正奇怪的是，它并不总是这样做。调整轮廓样式后，轮廓行为立即恢复为类似于在其他浏览器上看到的外观：

a:focus{    outline-style: dashed;}

不幸的是，由于轮廓渲染的定义不明确，因此无法判断任何浏览器在这方面是否存在错误。尽管HTML5明确允许

a

元素包含大多数其他元素，但它根本没有说明应如何调整其显示模式，因此看起来浏览器对此无能为力。但是，这里的主要问题是概述。

解决原始问题的简单方法当然

display

是将

a

元素的样式显式设置为默认样式以外的其他样式

inline

。通过使其更具可预测性，这至少将改善轮廓渲染。您可能希望也可能不希望将

div

元素的样式移到元素上

a

，这取决于这些元素

div

在布局中所扮演的角色以及它们是否必要。

a

实际上，由于我在规范中所描述的，您所拥有的大多数样式实际上并没有真正生效。