0

我刚刚遇到了一个我似乎无法通过网络识别的 IE6 错误。

基本上这是触发行为的时间：块元素在除底部之外的所有边上都有边框，以及顶部/底部填充。里面还有另一个块元素。

我的整个代码太大了，无法放入这里，但我将其缩小到这个简单的示例：

<div style="border: 5px solid red; border-bottom: 0; padding: 5px;">
    <p>adasasasdas</p>
</div>
Following stuff

现在出了问题的是“Following stuff”的位置（不管是什么），将被奇怪地改变。在这种情况下，左边有几个像素。

要禁用这种奇怪的行为，我可以保留底部边框、去掉填充或使包含的元素内联。但我有点想要他们两个。在我不得不放弃它们之前，我想看看是否有关于这个错误的知识以及是否有替代修复。

谢谢！

4

4 回答 4

1

这是对错误的一个很好的修复：

<div style="border: 5px solid red; border-bottom: 0; padding: 5px; font-size:0">
    <p style="font-size:16">adasasasdas</p>&nbsp
</div>
Following stuff

基本上，在 div 的末尾必须有一些内联文本，IE6 才能正确呈现它。由于   在底部添加了一个额外的行，我将 . 中的字体大小更改为 0 div，然后在<p>. 这对 div 的高度（在所有主流浏览器中约为 2 像素）的影响非常小，但用户根本不会注意到它。或者，您可以尝试将 中的line-height变量更改为 0% div，然后在 中更改回 100% p，但这似乎比我尝试它时div的方法多几个像素。font-size

于 2009-11-03T15:30:58.267 回答
0

我的解决办法是

<div style="border: 5px solid red; padding: 5px; padding-bottom:4px; border-bottom: 1px solid white;">
    <p>adasasasdas</p>
</div>
Following stuff

但这可能不适用于您，具体取决于上下文

于 2009-11-03T10:25:22.543 回答
0

这可能会帮助你

<div style="border-left: 5px solid red; border-top: 5px solid red; padding: 0px;"> <p style="margin:0px; padding:10px;">adasasasdas</p> </div> Following stuff

如果要填充调整<p>标签中的填充

于 2009-11-03T10:37:49.830 回答
0

嘿，我知道这是旧的，但我也花了几个小时与这个错误作斗争（事实上，我花了这么长时间才弄清楚这是因为边框底部 + 填充底部......这是一个耻辱因为如果我知道要搜索什么，我会更快找到这个）。

无论如何，我突然想到这是 ie6 中 hasLayout 问题的又一表现。出于我的目的，将“zoom:1”添加到有问题的 div 中突然神奇地修复了它，这样做的好处是不用担心字体大小和行高等。

于 2010-08-02T18:34:40.120 回答