固定导航栏与小型设备中的内容重叠

时间:2017-06-16 11:01:32

标签: html css twitter-bootstrap

我已经复制了代码,所以我不太了解它。设计似乎在桌面浏览器中工作正常,但只要我使用移动配置,页脚似乎与内容重叠..

<div class="navbar navbar-inverse navbar-fixed-bottom container">
    <div class="row">

    <div>
      <p class="navbar-text"  align="center">© 
      <script type="text/javascript">
                document.write(new Date().getFullYear());
            </script>   
           mywebsite.com
      </p>
    </div>



    </div>
</div>

这是CSS

body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
}

body { padding-top: 15px;}
    @media screen and (max-width: 768px) {
        body { padding-top: 0px; }
        body { padding-bottom: 60px; }
    }

这是页脚类..

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 40px;
  background-color: #f5f5f5;
  position: relative;
}

1 个答案:

答案 0 :(得分:0)

也许将整个导航包裹在

div class ='container'