0
感谢您阅读本文,我有一个菜单,以填充左侧的ul为中心,但我认为在左侧的IE中留下了一点白色的空白区域如何居中CSS菜单并摆脱ie左边距空间?
在Chrome,Firefox中看起来没问题和Opera但IE(每个版本)的空间,并且其不居中
这里是HTML
<div class="menu">
<ul>
<li id="current"><a href="#">Strona Glowna</a></li>
<li><a href="#">O nas</a></li>
<li><a href="#">Wlasciciel</a></li>
<li><a href="#">Kontakt</a></li>
</ul>
</div>
而CSS
.menu {
border:none;
border:0px;
margin:0px;
padding:opx;
font: 100% Arial;
font-size:14px;
font-weight:900;
}
.menu ul {
background:#333333;
height:35px;
list-style:none;
margin:auto;
padding:0 242px 0;
}
.menu li {
float:left;
padding:0px;
}
.menu li a {
background:#333333 url("images/seperator.gif") bottom right no-repeat;
color:#cccccc;
display:block;
font-weight:normal;
line-height:35px;
margin:0px;
padding:0px 25px;
text-align:center;
text-decoration:none;
}
.menu li a:hover, .menu ul li:hover a {
background: #FF0000 url("images/hover.gif") bottom center no-repeat;
color:#FFFFFF;
text-decoration:none;
}
.menu li ul {
background:#333333;
display:none;
height:auto;
padding:0px;
margin:0px;
border:0px;
position:absolute;
width:225px;
z-index:200;
}
.menu li:hover ul {
display:block;
}
.menu li li {
background:url('images/sub_sep.gif') bottom left no-repeat;
display:block;
float:none;
margin:0px;
padding:0px;
width:225px;
}
.menu li:hover li a {
background:none;
}
.menu li ul a {
display:block;
height:35px;
font-size:12px;
font-style:normal;
margin:0px;
padding:0px 10px 0px 15px;
text-align:left;
}
.menu li ul a:hover, .menu li ul li:hover a {
background:#2580a2 url('images/hover_sub.gif') center left no-repeat;
border:0px;
color:#ffffff;
text-decoration:none;
}
.menu li ul #current {
background:#2580a2 url('images/hover_sub.gif') center left no-repeat;
border:0px;
color:#ffffff;
text-decoration:none;
}
.menu p {
clear:left;
}
现场演示可以在adamlisik.co.uk/kantor
感谢您的帮助
发现是自己的身体为中心? – hjpotter92 2012-04-12 21:51:33
您似乎在'.menu'的CSS中为'opx''填充'而不是'0px'。 – 2012-04-12 21:55:33