Question

在这种情况下，Internet Explorer似乎没有给出适当数量的保证金。看起来它从框顶部测量边距并忽略填充。为什么是这样？有一个很好的解决方法吗？这是一个例子：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>

        <style type="text/css">
            .messagebox
            {
                border: solid 2px black;
                background: blue;
                color: white;
                padding: 10px; /* Problem only when padding set */
            }

            h1, h2, h3, h4 
            {
               margin-top: 12px;
            }

        </style>
    </head>
    <body>
        <div class="messagebox" style="width: 300px">
            <h4 style="text-align: center">In IE, this text is 10px higher than in FF.</h4>
        </div>
    </body>
    </html>

我在IE7和FF3工作。感谢。

Answer 1

欢迎来到IE box model bug

Answer 2

您可以尝试

body{
zoom:1;
}

我不确定这是否会有所帮助，但如果确实如此，它可以快速解决！

Answer 3

我没有具体的答案，但我一直在努力解决IE和FF之间的差异，因为它与边距和填充有关。

您可能需要明确放入doc type标记。特别严格的模式。这应该让他们强迫他们进入相同的布局模型。从那以后，你处理的是艺术而不是科学。

祝你好运。

div中带有填充的Internet Explorer边距问题

3 个答案: