Html 水平对齐不'；我不在IE工作_Html_Css_Alignment

Html 水平对齐不'；我不在IE工作

html css

Html 水平对齐不'；我不在IE工作,html,css,alignment,Html,Css,Alignment,我试图将一个div水平对齐，但由于某些原因，它在IE中不起作用。。。我做错了什么 HTML <body> <div id="container"> <div id="header"> <img src="logo.png"> </div> <div id="top-nav"> <ul class="menu">

我试图将一个div水平对齐，但由于某些原因，它在IE中不起作用。。。我做错了什么

HTML

<body>
    <div id="container">
        <div id="header">
            <img src="logo.png">
        </div>

        <div id="top-nav">
            <ul class="menu">
                <li class="first leaf menu-mlid-471"><a href="">Home</a></li>
            </ul>
        </div>
    </div>
</body>

body{
   background-color: #fff;
   margin: 0;
   padding: 0;
 }
ul.menu{
   width: 500px;
   margin: auto;
 }
 #header{
   height: 150px;
 }

对于Firefox、Chrome、Safari，。。。没问题。这一切恰好在中间。但IE拒绝将其正确对齐…

请在CSS下方使用

.ie ul.menu{
           width: 500px;
           margin: auto;
           display:block;
 }

使用下面的CSS

.ie ul.menu{
           width: 500px;
           margin: auto;
           display:block;
 }

你有doctype吗？如果没有它，IE将恢复到Quirks模式，该模式不支持

margin:auto居中
此外，IE<6不支持margin:auto完全居中（以防IE浏览器合规性对您特别重要）。
您有doctype吗？如果没有它，IE将恢复到Quirks模式，该模式不支持margin:auto居中
此外，IE<6不支持margin:auto完全居中（以防您对古老的IE浏览器的遵从性特别重要）。
试试这个.IE ul.menu{
宽度：500px；
左边距：自动；
右边距：自动；
显示：block；}
试试这个.ie ul.menu{
宽度：500px；
左边距：自动；
右边距：自动；
显示：block；}
实际上，如果您在菜单div周围放置边框，您将在IE中看到div在中间对齐，但是您的ul内容没有对齐。请将此弹出到您的CSS中，并查看您得到的结果：
ul.menu{
width: 500px;
margin: auto;
border:solid black thin;
text-align:center;
}

应该在IE中工作。
实际上，如果在菜单div周围放置边框，您将在IE中看到div在中间对齐，但是，您的ul内容没有对齐。请将此弹出到您的CSS中，并查看您得到的结果：
ul.menu{
width: 500px;
margin: auto;
border:solid black thin;
text-align:center;
}

应该在IE中工作。
ul.菜单居中，但菜单中的文本不居中，为什么不使用文本对齐：居中？在这里拉小提琴->ul.菜单居中，但菜单中的文本不居中，为什么不使用文本对齐：居中？在这里拉小提琴->谢谢你的建议。但这没什么区别。。。IE中的菜单仍然向左对齐，没有自动边距。是的，
标签默认显示为块。感谢您的建议。但这没什么区别。。。IE中的菜单仍然向左对齐，没有自动边距。是的，
标签默认在块中显示。