html - 菜单的 CSS 问题

标签 html css

我的网站上有一个可用的菜单,但是当我将它从一个虚拟主机移到另一个虚拟主机时,它有点坏了,我不确定为什么,因为我没有更改任何文件。

它看起来像下图,我自然希望博客元素(和其他元素)向左对齐,并且没有那个高出 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/

相关文章:

html - 使用 float 按网格对齐内容的问题

html - 如何为手机拨号屏幕创建href?

css - 为什么我的 bootstrap (3) 网格没有响应?

javascript - 使用 select2 中选定的选项隐藏组件

html - 删除 MyEclipse 中的警告

css - 具有固定行高文本溢出省略号垂直对齐的响应式 html/css 表

jquery - 在显示网站之前对所有图像充电

html - 这个 CSS 布局我做错了什么?

javascript - onchange 事件期间的 UnderScore 动态过滤器

javascript - 在响应表中,第二列值与第一列值重叠