css - css 导航栏不扩展 t

Question

我的 css 导航栏没有延伸到页面的末尾。我在每个菜单链接周围都有一个框，但我希望该颜色再延伸 700 像素，这样它就不仅仅是空白。

这是我的html

 <ul id="button">
    <li><a href="#">Home</a></li>
    <li><a href="#">Contact </a></li>
    <li><a href="#">Resum&eacute;</a></li>
    <li><a href="#">Help</a></li>
 </ul>

这是我的CSS

#button {
    padding: 0px;
}
#button li {
    display: inline;

}
#button li a {
    font-family: Arial;
    font-size:14px;
    text-decoration: none;
    float:left;
    padding: 10px;
    background-color: #4169E1;
    color: #fff;

    }
#button li a:hover {
    background-color: #E30800;
    margin-top:-2px;
    padding-bottom:12px;
}

Answer 1

请使用这个

#button {padding: 0px;float:left;width:100%}

Answer 2

将高度属性添加到您的 CSS。最小高度也可能有帮助。使用 % 而不是像素会使其更流畅、更美观。