Angularjs的网站页脚无法触及底部。背景保持在页脚下方

时间:2015-02-04 13:10:57

标签: html css angularjs

嗨,我很难让页脚部分触及网站的底部。

正如你在屏幕截图中看到的那样......在灰色页脚栏下方有一条青色条(身体背景颜色的一部分)......我不希望它在那里。我希望灰色的页脚部分触及底部。我已经将代码弄乱了好几个小时,无法触及底部。

感谢。

screenshot1

我尝试过使用

position: absolute;
bottom: 0;

这是index.html的一部分

    <html>
    <body>



 <!--HEADER AND NAVBAR -->


<!--MAIN PARTIAL-->
<div ui-view class=""></div>


</div>
</div>


<!--Footer Partial -->
  <div id="footer" ng-include="'partials/footer.html'"></div>

</body>
</html>

这是页脚部分代码。 footer.html

<div class="footer">



 <ul class="links">
          <li><a href="https://www.facebook.com/clearfinance"><i class="fa fa-facebook fa-2x"></i></a></li>
          <li><a href="https://twitter.com/OilRecCandidate"><i class="fa fa-twitter fa-2x"></i></a></li>
          <li><a href="https://www.youtube.com/user/clearfin1"><i class="fa fa-youtube fa-2x"></i></a></li>
          <li><a href="https://plus.google.com/116852466188350790084/auto"><i class="fa fa-google-plus-square fa-2x"></i></a></li>
          <li><a href="https://www.linkedin.com/company/105027?trk=cws-btn-overview-0-0"><i class="fa fa-linkedin-square fa-2x"></i></a></li>
        </ul>


Text goes here
</div>

这是style.css

的一部分
/* general settings */
html {
 min-height:100%;
  overflow-x:hidden;
  overflow-y:scroll;
  position:relative;
  width:100%;
background-color:#0783A9;

}
body {
  background-color:#0783A9;
  font-family:"Verdana", sans-serif; color:#c4c4c4; font-size:16.0px; line-height:1.19em;
  color:#000;
  font-weight:100;
  margin:0px;
 min-height:100%;
  width:100%;
    }

.footer {
     background-color: #cecece;
     color: #FFFFFF;
      font-size: 10px;
      text-align: center;
      margin-top: 0px;
      margin-bottom: 0px;
      width: 100%;
      margin-left: auto;
      margin-right: auto;
      position:absolute;
      bottom:0;

}

0 个答案:

没有答案