Question

我在怪癖模式下遇到IE8问题。我有一个外部div元素包含两个内部div。

<div style="margin-left:160px; margin-top:10px; margin-right:0px; height:10px; background:blue;">
    <div style="position:relative; float:left; width:10px; height:10px; background:orange;"></div>
    <div style="position:relative; margin-left:10px; margin-right:0px;height:10px; background:green;"></div>
</div>

内部div应该跨越整个包装div，它在firefox和chrome中工作正常。但是当我在IE8中看到这一点时，橙色div和绿色div之间存在一个奇怪的差距。有谁知道如何解决这个问题（或解决它）？另外，我不能在文档中的任何位置放置doctype声明。

Answer 1

对于怪癖模式，在容器上使用绝对定位和相对定位：

    <html lang="en">
    <head>
        <title>Quirksmode Tests</title>
    </head>
    <body>
        <div style="position:relative; margin-left:160px; margin-top:10px; margin-right:0px; height:10px; background-color:blue;">
          <div style="position:absolute; top:0; width:100%; right:0; height:10px; background-color:green;"></div>
          <div style="position:absolute; top:0; left:0; width:10px; height:10px; background-color:orange;"></div>
        </div>
    </body>
    </html>

<强>参考

IE8怪癖模式中相邻div之间的奇怪差距

1 个答案: