html/css 页脚未定位

Question

所以基本上我做了一个页脚，当我把它变小时，白色 space 出现在它下面，没有白色 space 的最小尺寸是 40px（对我的网站来说太大了).任何人都知道我做错了什么，我也一直在尝试在导航下添加版权，但无论我更改什么，它都只是放在上面！

header:after,
section:after,
article:after,
footer:after,
#navigation-top:after,
#navigation-bottom:after,
#page-header-wrapper:after,
#banner-area-wrapper:after,
#page-body-wrapper:after,
#page-footer-wrapper:after,
.clearer:after {
  content: "";
  display: table;
  clear: both;
  width:960px;
  margin:0 auto;

}


footer nav {
  float:left;
}


footer nav ul li {
  display: inline-block;
  margin-left:10px;
  list-style: none;

}

footer nav ul li a {
  font-family: tpeb;
  font-size:12px;
  color: #fff;
  text-align: center;
}


footer {
  width:100%;
  background-color: #292929;
  padding:40px 0px;
}

<footer>
  <div class="wrapper">
      <p>
      <nav>
     <ul>
         <li><a href="index.html">HOME</a></li>
         <li><a href="anime.html">ANIME</a></li>
         <li><a href="manga.html">MANGA</a></li>
         <li><a href="forums.html">FORUMS</a></li>
         <li><a href="faq.html">FAQ</a></li>
         <li><a href="contact.html">CONTACT</a></li>
      </ul>
    </nav>
</div>

</footer>

Answer 1

我无法从您发布的 HTML/CSS 判断您的网站是否在高度方面太短（这会导致在页脚下留下剩余的白色-space）。

如有疑问，如果您确实希望页脚位于页面底部，

footer {
    position:absolute;
    bottom:0;
/* anything else style-wise*/
}

你的

footer nav {
  float:left;
}

似乎是导致您的版权信息被推送的原因。您可以将其更改为：

footer nav {
  left:0;
}

在没有俯卧撑的情况下获得类似的效果。通常，如果发现定位问题，请避免在 CSS 中使用 'float'。

html/css 页脚未定位

html/css footer not positioning

html

css

footer