我的导航栏居中,但是如果尝试添加第6个选项卡,则会将导航栏的选项卡包装到下一行。
我专门在此网页上工作,但在本网站的其他部分也有同样的问题。 http://ventricular.org/CORTICALEVOLUTION2018/corticalevolution2018.html
它在Safari中执行此操作,但在Chrome中不执行。
nav{
float:right;
width:100%;
display:block;
height:40px;
}
nav ul li{
display:block;
width:16%;
float:left;
text-align:center;
}
nav ul li a{
font-family: Candara;
width:90%;
text-decoration:none;
text-transform:uppercase;
font-weight:400;
line-height:250%;
display:block;
color:#9933cc;
}
nav ul li a:hover{
color:#9933cc;
}
nav ul li p{
font-family: Candara;
width:90%;
text-decoration:none;
text-transform:uppercase;
font-weight:400;
line-height:250%;
display:block;
color:#9933cc;
}
<nav> <!-- Navigation Start -->
<ul>
<li><a href="corticalevolution2018.html">HOME</a></li>
<li><a href="speakers.html">SPEAKERS</a></li>
<li><a href="sponsors.html">SPONSORS</a></li>
<li><a href="2018_Conference_Photos.html">PHOTOS</a></li>
<li><a href="contact.html">CONTACT</a></li>
<li><a href="http://ventricular.org">VENTRICULAR.ORG</a></li>
</ul>
</nav> <!-- Navigation End -->
</div><!--/top-->
<hr/><!-- Horizontal Line -->