我的导航栏居中并且在 Firefox 22 和 Chrome 27 但在 IE 8 中完美运行,我讨厌成为那样的人,但这是怎么回事?如果一切都很好,那不是很好吗,如果这与工作无关我不在乎,但我们一直在使用 IE。是否有某种跨浏览器兼容性的资源,或者它只是通过火试验??
CSS 标记
body
{
font-family: Arial, Helvetica, sans-serif;
font-size: 15px;
margin: 0;
padding: 0;
}
.container
{
width: 1004px;
margin: 0 auto;
text-align: center;
}
.navigation
{
text-align: center;
display: inline-block;
list-style-type: none;
text-align: center;
}
.navigation li
{
float: left;
width: 150px;
position: relative;
}
.navigation li a
{
color: #fff;
display: block;
padding: 8px 7px 8px 7px;
text-decoration: none;
border-top: 1px solid #F2861D;
background: #262626;
text-align: center;
text-transform: uppercase;
}
.navigation li a:hover
{
color: #F2861D;
}
.navigation ul
{
position: absolute;
left: 0;
display: none;
margin: 0 0 0 -1px;
padding: 0;
list-style: none;
border-bottom: 3px solid #F2861D;
}
.navigation ul li
{
width: 150px;
border-top: none;
}
.navigation ul a
{
display: block;
height: 15px;
padding: 8px 7px 13px 7px;
color: #fff;
text-decoration: none;
border-top: none;
border-bottom: 1px dashed #6B6B6B;
}
.navigation ul a:hover
{
color: #F2861D;
}
HTML 标记
<div class="container">
<div class="navigation">
MY NAVIGATION
</div>
</div>
最佳答案
在文档顶部使用它:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
或者,如果可能的话:
.container{
width:100%; //auto
margin:0 auto;
text-align:center;
}
相关问题:
关于css - 导航栏以 FF 22 Chrome 27 为中心,但不是 IE 8,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18018317/