Question

我的页脚出现问题，因为它粘在屏幕底部而不是位于页面底部，任何人都可以帮助我坐在页面底部而不是底部屏幕？

＆＃13;

footer {
  position: fixed;
  left: 0px;
  bottom: 0px;
  height: 70px;
  width: 100%;
  background: #2c2c2c;
}

#footer_container {
  max-width: 940px;
  height: 70px;
  margin: 0 auto;
  padding-top: 2%;
}

.social {
  list-style-type: none;
}

.social li a {
  position: absolute;
  bottom: 0;
  right: 0;
  display: inline;
  float: right;
  padding: 10px;
  text-decoration: none;
  color: #FFFFFF;
  font-weight: bolder;
}

.social>li>a:hover {
  color: #D9D9D9
}

.copyright_text {
  position: absolute;
  bottom: -10px;
  left: 0;
  padding-top: 2%;
  float: left;
  text-transform: uppercase;
  font-size: 0.30cm;
  color: #fff;
  margin-left: 20px;
}

.logo_footer {
  display: flex;
  align-items: center;
  position: fixed;
  left: 0px;
  bottom: 15px;
  height: 50px;
  width: 100%;
  margin-left: 20px;
  margin-bottom: 5px;
}

＆＃13;

<footer>
  <div id="footer_container">
    <img src="images/logo.png" title="AccountPanda" style="width:112.5px;height:37.5px;" class="logo_footer">
    <p class="copyright_text">&copy; Copyright 2017 AccountPARADISE</p>
    <ul class="social">
      <li><a href="https://twitter.com/accountparadise" target="_blank">TWITTER</a></li>
    </ul>
  </div>

</footer>

＆＃13;

Answer 1

如果你使用position：fixed;然后您的元素将被投放到依赖于您的屏幕的位置。

如果你想把它扔掉，你可以做多件事。您可以拥有一个父级容器，其位置相对于绝对底部：0。

或者只是将显示块放在其他html容器下面。

这样，它将在页面底部和页面底部对齐。

Answer 2

只是不要使用position: fixed - 从页脚的CSS规则中删除它，然后它将简单地低于它上面的所有其他元素。（在这种情况下，left和bottom参数也可以删除，它们仅与“定位”元素相关）

阻止我的页脚坐在屏幕的底部

2 个答案: