我的目标是让我的#header div 居中。它包含导航到不同页面的按钮。我尝试使用<div align=center>标签，但它不起作用。我只是希望它像我页面上的其他所有内容一样位于中心。
这是我的代码：
<style>
#header ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
#header ul li {
position:relative;
float:left;
}
#header ul li ul li a {
font-size: 12px;
}
#header ul li a {
display: block;
height: 35px;
width: 90px;
color: #666;
text-decoration: none;
font-family: Verdana, Geneva, sans-serif;
line-height: 35px;
text-align: center;
}
#header ul li ul {
position: absolute;
top: 31px;
visibility: hidden;
}
#header ul li a:hover {
color: #333;
font-weight: bold;
}
#header ul li:hover ul {
visibility: visible;
}
#header {
width:100%;
margin: 0px auto 0px auto;
text-align:left;
}
body {
padding-left:40px;
padding-right:40px;
text-align: center;
}
</style>
</head>
<body bgcolor="#E6F7F4">
<center>
<p><img src="othlogo.gif"/><br />
</p>
<div id="header" align="right" >
<ul>
<li><a href"blog.html">Blog</a>
</li>
</ul>
<ul>
<li><a href"blog.html">More</a>
<ul>
<li><a href="more.html">Education</a></li>
<li><a href="more.html">Domestic</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href"blog.html">Option3</a>
<ul>
<li><a href="more.html">Psychology</a></li>
<li><a href="more.html">Map</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href"blog.html">About</a>
</li>
</ul>
</div>