上传到Web服务器后，布局中断

Question

我开发了一个小网站（100％css布局）。我已经在IE，Firefox上测试了它看起来很好。 我将其上传到我的托管公司之后，Web服务器布局仅在Internet Explorer上打破。我的意思是css正确加载但有些元素不在他们的位置。我检查了几次我本地电脑和网络服务器上的css文件，他们有相同的内容。

例如

#main{
    position: relative;
    width: 960px;
    margin: 0 auto;
}

上面的代码将#main div放在屏幕的中心。在我的电脑上它在IE，Firefox等上工作正常。但在网络服务器上，div在IE上浮动到左边

可能出现什么问题？

Answer 1

Internet Explorer有许多用于确定文档呈现模式的内容。本地或互联网上的文件就是其中之一。

添加

<meta http-equiv="X-UA-Compatible" content="IE=edge"> 

然后检查文档是否一致（两者都中断或两者兼容）。如果是这样，那就确认问题是什么，你只需要修复CSS就可以在最佳标准模式下使用IE。

Microsoft provide more details

另外请确保您没有使用工具栏上的兼容性按钮强制兼容较旧的IE浏览器版本。

Answer 2

对于IE的早期版本，您需要添加额外的CSS来使事情集中，即：

body {text-align: center};

然后你还需要添加text-align：left;到第一个子div，所以文本不居中：

#main{
position: relative;
width: 960px;
margin: 0 auto;
text-align: left;
}

如果浏览器的行为与早期版本相同，我认为这可能是问题所在，请尝试将其添加到您的代码中。