Question

我有一个开发服务器和一个生产服务器来托管我的网站。我看到html在这些服务器上呈现的方式存在差异，但仅限于Internet Explorer。

我正在渲染一个标签列表。这是标记。

<div class="tag">
    <ul>
        <li><a href="#">tag1</a></li>
        <li><a href="#">tag2</a></li>
        <li><a href="#">tag3</a></li>
    </ul>
</div>

这是css。

.tag
{

}

.tag ul
{
    margin-top: 5px;
    padding-left: 5px;
}

.tag li
{
    display:block;
    float:left;
    margin: 1px 1px 1px 0px;
}

.tag a
{
    color: white;
    font-weight: bold;
    text-decoration: none;
}

方案：

当我在任何不是服务器的机器上在IE8中查看此页面时，标签div正在添加大约50px左边距或填充。
当我在Windows8 2008机器上以物理方式在IE8中查看此页面时，标记div正确显示边距和填充
当我在本地开发服务器上的IE8中查看此页面时，标记div正确显示边距和填充。
在我的开发服务器和生产服务器上托管的Google Chrome和Firefox中查看此页面时，代码div会正确显示边距和填充。

这告诉我，我有一个非常具体的情况，即添加了边距/填充。我在页面上似乎没有任何Javascript错误，我甚至通过W3C验证了我的页面以检查标记问题。

使用IE开发工具，我可以看到div元素在它工作的情况下和它不起作用的地方之间的唯一区别是div在它不起作用时如下所示：

<div class="tag" sizcache="0" sizset="2">

区别在于sizcache和sizset属性。我尝试在开发人员工具中关闭这两个属性，但它没有改变最终结果。他们可能在那里，因为我做了一些标签的jQuery样式：

$('.tag ul').buttonset();

取出此jquery代码不会改变最终结果。使用开发工具我甚至取消了所有样式（甚至是身体继承的样式），但我仍然得到了边距/填充。

Answer 1

在IE8中，我会检查一些事情。问题可能与您的浏览器处于IE7兼容模式有关。这可以是您通过工具栏或server can enforce this自行更改的设置，方法是设置HTTP标头，如下所示：

X-UA-Compatible "IE=EmulateIE7"

Microsoft提供了有关Compatibility View的更多信息。

Answer 2

在IE8中，UL默认为左边距，以缩进它们。要删除它，请将以下内容添加到.tag ul：

margin-left: 0px;

服务器之间的CSS差异差异

2 个答案: