在ios中滚动时,Bootstrap 3导航栏未固定到底部

时间:2017-02-23 15:46:17

标签: html ios css twitter-bootstrap-3 navbar

我使用-viewport-overflow-scroll:touch;溢出:自动;能够在ios中使用动量滚动但我有引导程序导航栏的问题。当我在ios中滚动时,导航栏停留在页面中间,直到我停止滚动,然后几秒钟后它再次粘到底部。有任何想法吗?导航栏位于div内,并带有滚动触摸功能。 这是导航栏:

<nav class="navbar navbar-fixed-bottom footer">
    <div class="pull-left footer-text">
        <span>All rights reserved</span>
    </div>
    <div class="pull-right footer-icons">
        <img class="footer-icon" />
        <img class="footer-icon" />
    </div>
</nav>


.footer{
min-height:1em;
bottom:0;
background-color: #35AEEE;
right: 0;
left: 0;
color: white;
}

1 个答案:

答案 0 :(得分:0)

由于您有bottom: 0;,因此您可以添加position: absolute;属性,使其粘贴到页面底部。

.footer {
  min-height: 1em;
  bottom: 0;
  background-color: #35AEEE;
  right: 0;
  left: 0;
  color: white;
  position: absolute;
}
<nav class="navbar navbar-fixed-bottom footer">
  <div class="pull-left footer-text">
    <span>All rights reserved</span>
  </div>
  <div class="pull-right footer-icons">
    <img class="footer-icon" />
    <img class="footer-icon" />
  </div>
</nav>