导航栏填充页面失败？

Question

HTML：

<footer>
  <nav class="navbar navbar-inverse navbar-static-top" bottom="0" role="navigation">
    <div class="container">
      <ul class="nav navbar-nav">
        <li><a href="#">Apple Music</a></li>
        <li><a href="#">Spotify</a></li>
        <li><a href="#">Shazam</a></li>
        <li><a href="#">SoundCloud</a></li>
        <li><a href="#">© 2018 GetMedia. All rights reserved.</a></li>
      </ul>
    </div>
  </nav>
</footer>

我不知道bottom="0"到底是怎么不让底部导航栏进入底部来填充页面的。我有办法解决这个问题吗？

Answer 1

您必须使用CSS。如果您希望导航位于页脚的底部，则可以使用以下方法：

footer {
  display:flex;
}
nav {
  align-self: flex-end;
  flex-grow: 1; //to be on 100% width of footer
}

我还看到您有“ navbar-static-top”类，这可能会导致顶部定位。