Question

我知道双边距错误，但这是不同的..情节是有一个带有底部边距的元素，然后在它下面直接包含一个包含浮动元素的元素（在结尾处被清除），容器元素可能会说一个底部边框应该位于它包含的浮动元素之下..但是IE7和6，底部边框与其内容间隔开，与其上方元素的底部边距完全相同。

这不是真正的继承，更多的是边际被应用两次并处于错误的位置..这里是一些回购代码：

<h1 style="margin: 0 0 50px 0;">Menu</h1>
<div style="border-bottom: solid 1px #000;">
    <div style="float: left;">Hello world?</div>
    <div style="clear: left;"></div>
</div>

坚持投诉页面（我使用xhtml transitional），你会注意到文本下方没有出现边框，但是距离它有50px ......“菜单”与文本隔开的距离相同文本..

对照说.. IE8进行测试，边框正确地坐在文本下面。

这是我之前注意到并且设法忽略并解决的问题，但我想知道这个错误是否被命名，以及是否有一个很好的方法来解决它..

（我通常会这样做的方法是用填充来替换H1，但这并不总是合理的。）

Answer 1

您需要在外部div上调用hasLayout才能正确显示IE。您可以通过向div添加宽度或高度或缩放来实现：1。

这些也会在IE中清除你的浮动，这样你就可以移除<div style="clear: left;"></div>。要清除其他浏览器中的浮动，请使用overflow：hidden;

<h1 style="margin: 0 0 50px 0;">Menu</h1>
<div style="border-bottom: solid 1px #000;overflow:hidden;zoom:1;">
    <div style="float: left;">Hello world?</div>
</div>

IE6和7，奇怪的边缘'继承'

1 个答案: