我的网站上有一个可用的菜单,但是当我将它从一个虚拟主机移到另一个虚拟主机时,它有点坏了,我不确定为什么,因为我没有更改任何文件。
它看起来像下图,我自然希望博客元素(和其他元素)向左对齐,并且没有那个高出 2px 的灰色框。 http://img600.imageshack.us/img600/2066/61967761.png
我的 CSS 是:
#header {
display:block;
overflow:hidden;
width:960px;
height:174px;
background:url(../App_Themes/logo01.png) no-repeat -2px 14px;
}
#header ul {
display:block;
overflow:hidden;
float:right;
height:38px;
margin-top: 0px;
}
#header ul li {
display:block;
overflow:hidden;
float:left;
margin-left:2px;
}
#header li ul{
background: rgb(211,211,211);
display:none;
height:auto;
position:absolute;
width:180px;
z-index:200;
margin-left: 9px;
}
#header li li {
display:block;
float:left;
padding: 0px;
width:180px;
margin-left: 0px;
border-bottom: 1px solid;
border-color: #fff;
height: 25px;
}
#header li:hover ul{
display:block;
}
#header li ul li a {background-image: none;
color:#000;
text-indent: 0px;
font-family: Tahoma;
font-size: 12px;
width: 180px;
padding-top: 5px;
padding-left: 5px;
text-decoration: none;
}
#header li ul li a:hover {background-image: none;
background: rgb(26,66,126);
color:#fff;
}
#header .tagline {
display:block;
overflow:hidden;
float:right;
margin-top:40px;
width:620px;
}
HTML 示例:
<div id="header">
<ul id="menuElem">
<li class="menublog">
<a href="... />
</li>
<li class="menuabout">
<a href="... />
</li>
</ul>
</div>
这可能是什么问题?
最佳答案
为您的 ul 和 li 重置所有边距和填充并重新设置边距。
喜欢:
#header ul {
display:block;
overflow:hidden;
float:right;
height:38px;
margin:0;
padding:0
}
李也一样。在生产服务器上上传新模板时,我经常遇到这种情况。
关于html - 菜单的 CSS 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4998153/