如何在导航栏中添加另一个选项卡而不将其包装到下一行?

时间:2019-04-01 20:31:38

标签: css menu navigationbar

我的导航栏居中,但是如果尝试添加第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 -->

0 个答案:

没有答案