在很长一段时间里，我在 Firefox 和 IE 中遇到了一些垂直间距问题。
我正在使用一个*我的 css 中的选择器将边距应用于某个容器元素内的所有内容。在 Chrome 中工作正常，但是在 FF 和 IE 中，我似乎不知从何而来得到了神秘的额外填充，正如你可以在这里观察到的：http://jsfiddle.net/XrVXF/3/ http://jsfiddle.net/XrVXF/3/.
事实证明我有两个不同的问题。一是非 Chrome 浏览器会选择带有*选择器并应用边距和页边距显示在浏览器中！即使该元素对于 Firebug 之类的东西来说是不可见的。这应该被视为一个错误吗？您可能会问 body 标记内的 link 元素有什么作用。好吧，我可能可以避免它，但这是在我的网站上做一些事情的最简单的方法。这一页 http://www.tutorialchip.com/tutorials/html5-block-level-elements-complete-list/说*选择器应该只适用于我正在使用的 HTML5 中的块级元素，因此从这个意义上说，在我看来，Firefox 至少正在出问题，如果 IE 应该有适当的 HTML5 支持的话，IE 也是如此。现在我知道了这一点我可以解决它但是也许我还应该担心其他因素？（似乎不适用于脚本或样式标签。）我最好将边距应用于大量 html 元素而不是*?
另一个奇怪的事情，你可以在我链接的小提琴中观察到，底部的clearfix（在示例中不是必需的，但在我的网站上）也拾取边距并将其应用于 FF 和 IE，但不是在 Chrome 中。哪种行为是“正确”的？奇怪的是，我注意到关闭溢出：隐藏可以防止clearfix占用空间，并且似乎不会对我的网站产生任何有害影响。将溢出设置为隐藏的目的是什么？
更正：哎呀，当我打算使用 .clearfix （在浮动内容之后附加内容）时，我正在使用 .clear，这似乎工作正常并且没有边距问题。
这应该被视为一个错误吗？
考虑到您将样式应用到原本不应该出现的位置的元素（link in body???)，这是任何人的猜测。它们没有出现在 Firebug 中的可能原因是 Firebug 不希望它们出现在那里。
严肃地说，我对你的小提琴中发生的事情的最佳猜测是：
Chrome 有 UA 风格link元素到display: none。我想它对于属于该中的任何其他元素也有同样的作用head元素而不是body.
-
其他浏览器没有默认display风格为link元素，而不是依赖head具有display: none隐藏属于其中的一切head元素也是如此。所以当你放置一个link within body，它显示有边距，因为它显示的是初始值display: inline.
FWIW，如果你给它一种风格display: block, 它的利润率将会崩溃 http://www.w3.org/TR/CSS21/box.html#collapsing-margins并且它会产生与之前相同的明显效果display: none就像在 Chrome 中一样。
再说一次，这是基于你的小提琴中的无效标记，所以我不能说哪个浏览器，如果any，是对还是错，因为所有规范都说不应该渲染页头。另外，提示关于这是否是不使用*选择器，或不编写无效 HTML 的原因，或两者兼而有之......
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
