2013-01-20 40 views
0

我的目標是讓我的#header div居中。它包含用於導航到不同頁面的按鈕。我試過使用<div align=center>標籤,但它不起作用。我只希望它像我的網頁上的其他所有內容一樣位於中心位置。爲什麼我的div按鈕不是「中心」?

這裏是我的代碼:

<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> 
+0

1.它現在在align = right,但align = center不會做任何事情。我覺得有些東西阻止了它的集中。 – user1995608

+1

您可以使用'margin:auto'來居中...而不是'center'標籤或'align',它們已被棄用。 http://jsfiddle.net/是讓人們看到你的代碼並幫助你解決問題的好方法。是的,你有一個「保證金:汽車」,但還有其他問題。 – MikeSmithDev

回答

0

您可以使用margin: auto居中#header,只要它的寬度設置就可以了。

+0

謝謝!它的工作原理: #首頁{ \t width:600px; \t margin:0 auto; \t background-image:url(toolbar.gif); } – user1995608