Question

我刚刚开始尝试构建一个网站，我在编辑现有的CSS文件时遇到了一些麻烦。我有它，所以在Chrome中菜单是居中的，但在Internet Explorer中，它保持对齐 - 我希望它始终处于中心位置。

网站为http://rkalbanart.co.uk/

有快速解决方法吗？我已经尝试使用谷歌搜索，但凭借我的傻瓜知识，一切都远远超过了我的头脑！

Answer 1

您正在使用display: table;对齐此菜单，该属性在Internet Explorer 7上不起作用http://caniuse.com/css-table

因此，您不应该支持IE7或将您的菜单更改为我的示例

<强> CSS：

#main-menu-center-border:before,
#main-menu-center-border:after {
    content: " "; /* clearfix hack */
    display: table; /* clearfix hack */ 
}
#main-menu-center-border:after {
    clear: both; /* clearfix hack */
}
#main-menu-center-border {
    *zoom: 1; /* clearfix hack for IE6/IE7 */
}
#main-menu-center-border {
    max-width: 426px;
    display: block; /* instead of display: table */
}

Answer 2

不要将display: table应用于.main-nav，IE7不支持。

在this question

了解详情

Answer 3

如果要保留垂直对齐方式，可以在其上保留display:table，但对于IE7，您需要将宽度应用于div id =“main-menu-center-border”，否则它假设宽度为100％，不会居中。

#main-menu-center-border { max-width:430px; }

编辑：更改为最大宽度以支持自适应样式。或者，使用仅{1}}的IE7样式。

Answer 4

我认为您使用的是旧版本的资源管理器。因此，您需要使用名为版本10的较新版本的资源管理器。它在chrome和explorer 10中看起来相同。只需登录资源管理器10.它在版本10中完美运行。

CSS菜单在IE中左对齐但在chrome中居对齐

4 个答案: