为什么第一个菜单Iteam(.chosen)会在Chorme Browser中刷新?在我看来,它改变Padding-Right和Padding Padding-Bottom。请检查代码帮我解决这个恼人的问题。它在Firefox中很好
<body>
<header>
<div class="con_header">
<h1> SITE NAME</h1>
<nav>
<ul>
<li class="chosen"><a href="">HOME</a></li>
<li><a href="">ABOUT</a></li>
<li><a href="">SERVICES</a></li>
<li><a href="">PORTFOLIO</a></li>
<li><a href="">CONTACTS</a></li>
</ul>
</nav>
</div>
</header>
</body>
Css part of the code:-
<style type="text/css">
header {
background-color: #202628;
height: 80px;
color: #e7e7e7;
font-family: 'Roboto Condensed', sans-serif;
}
.con_header {
width: 1170px;
margin: 0 auto;
}
.con_header h1 {
float: left;
width: 500px;
}
.con_header nav {
float: right;
width: 600px;
}
.con_header::after {
content: '';
display: block;
clear: both;
}
.con_header ul {
margin-top: 26px;
padding: 0;
}
.con_header li {
display: inline;
}
.con_header li a {
color: #e7e7e7;
text-align: center;
text-decoration: none;
padding: 32.5px 8px;
margin: -4px;
}
.con_header li a:hover {
color: #e7e7e7;
background-color: rgb(232,76,61);
text-align: center;
text-decoration: none;
padding: 32.5px 8px;
margin: -4px;
}
.chosen {
color: #e7e7e7;
background-color: rgb(232,76,61);
text-align: center;
text-decoration: none;
padding: 32.5px 8px;
}
</style>