努力将浏览栏居中置于浏览器中间...尝试了谷歌发现的一些东西,但目前还没有运气。似乎应该是这样一件容易的事情,但它竟然是一个痛苦的脖子!中心水平导航菜单
继承人的代码。
<div id="nav">
<ul>
<li class="home"><a href="index.php">Home</a></li>
<li class="detail"><a href="about.php">About</a></li>
<li class="work"><a href="work.php">Work</a></li>
<li class="contact"><a href="contact.php">Contact</a></li>
</ul>
</div>
#nav {
width: 100%;
float: left;
margin: 0 0 1em 0;
padding: 0;
border-bottom: 1px solid #ccc; }
#nav ul {
display: inline-block;
list-style-type: none;
}
#nav li {
float: left; }
#nav li a {
display: block;
padding: 8px 15px;
text-decoration: none;
font-weight: bold;
color: #069;
border-right: 1px solid #ccc; }
#nav li:first-child a {
border-left: 1px solid #ccc; }
#nav li a:hover {
color: #50B748;
}
感谢,它仍然是轻微向右偏移,虽然,任何想法? – user3087394
你必须重置'ul'上的填充 - http://jsfiddle.net/Paulie_D/9ELje/10/ –
ul上没有填充?通过抵消,我会说它的权利约30px – user3087394