ここにナビゲーション バーのスクリプトがあります。
<style type="text/css">
/* Navigation Bar */
#nav_bar {
display:inline-block;
height:50px;
}
#nav_bar ul {
display:inline-block;
list-style-type: none;
border: 1px solid red;
width: 565px;
height: 100%;
text-align: center;
padding: 0;
margin: 0;
}
#nav_bar li {
display:inline;
height:100%;
padding: 0;
margin: 0;
}
#nav_bar a:hover {
background-color: #000000;
}
#nav_bar a {
display:inline-block;
height: 100%;
color:white;
text-decoration:none;
line-height: 50px;
padding: 0 1em 0 1em;
background-color: #900000;
}
</style>
</font>
ページの中央に表示するのがうまくいかないのですが、どうすればいいですか? 「display: inline-block;」を調べました。および「位置:相対」で、ナビゲーションバーのhtml部分が次のように機能するコードが見つかりませんでした(コメントに関して)お役に立てば幸いです!:)
<div id="nav_bar">
<ul>
<li> <a href="#">Home</a> </li>
<li> <a href="#">Forums</a> </li>
<li> <a href="#">Shipping Info</a> </li>
<li> <a href="#">Contact us</a> </li>
<li> <a href="#">About us</a> </li>
</ul>
</div>