是否有人建议为什么此列表不会显示并且水平居中。
当li项实际显示为内联时,我确信其中心是......
感谢
HTML:
<div id="nav">
<div class="navtable">
<ul id="nav1">
<li><img src="images/kranznav2.png" alt="kranz"/><a href="index.php">COMPETE</a></li>
<li><img src="images/thumbnav2.png" alt="thumb"/><a href="score.php">SCORE</a></li>
<div id="logolist"><li><a href="index.php"><img src="images/logorz.png" width="175em" /></a></li></div>
<li><img src="images/bagnav2.png" alt="bag"/><a href="index.php">SHOP</a></li>
<li><img src="images/morenav2.png" alt="more"/><a href="index.php">MORE</a></li>
</ul>
</div>
</div>
CSS:
#nav {
position:relative;
background:#ffffff;
width:100%;
height:0.2em:
overflow:visible;
margin-top:-2em;
font-family:Cusmyrb;
font-size:75%;
}
#logolist {
position:absolute;
padding-top:2em;
width:250px;
left:50%;
margin-left:-100px;
margin-top:-7%;
}
#nav a {
display:block;
margin-right:0% auto;
padding-left:0% auto;
color:#343234;
text-decoration:none;
}
.navtable {
display:table;
margin:0 auto;
}
ul#nav1 {
min-width:700px;
list-style:none;
padding-top:20px;
}
ul#nav1 li {
display:inline;
}
答案 0 :(得分:0)
添加如下内容:
.navtable {
margin: 0 auto;
width: 90px;
}
您需要为导航设置固定宽度,此示例将有效。
答案 1 :(得分:0)
如果您希望ul#nav1
居中,则只需添加margin: 0 auto;
即可。
div#nav
被设置为宽度100%,那么你就不会觉得这很有效,如果你把它设置为2000px
它应该正确显示它。
希望这有帮助:)