Question

CSS：

#nav {
    width: 100%;
    float: left;
    }

#nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

#nav li {
    float: left;
}

#nav li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

#nav a:hover:not(.active) {
    background-color: #111;
}

#nav.active {
background-color:#4CAF50;
}

HTML：

<body>

<div id="nav">
<ul>
  <li><a class="active" href="#home">Home</a></li>
  <li><a href="#news">News</a></li>
</div></body>

我似乎有空间在顶部，我无法获得全宽？怎么了？无论我做什么，我似乎都无法获得整个宽度和顶部的间距。为什么不宽度：100％在这里正常工作？

Answer 1

将其添加到样式表中：

body {
  margin: 0;
  padding: 0;
}

Answer 2

尝试在body标签中添加样式。

body{
margin:0px;
padding:0px;
}

这对我来说就是Firefox的诀窍。

css html全宽不正常

2 个答案: