Question

CSS

.footer {
  margin-top: 0;
  border-top: 1px solid #292929;
}

.footer-inner {
  padding: 15px 0;
  font-size: 12px;
  background: #111;
  color: #999;
}

HTML

<div class="footer">
<div class="footer-inner">
<div class="container">
  <div class="row">
    <div class="span12"> &copy; 2015 <a href="../../index.php">Japanex Rent-    A-Car Sdn Bhd</a>. </div>
    <!-- /span12 --> 
  </div>
  <!-- /row --> 
</div>
<!-- /container --> 
</div>
<!-- /footer-inner --> 
</div>
<!-- /footer -->

如何让我的页脚始终位于底部...因为当屏幕高度很短时，页脚并不总是位于页面底部...

Answer 1

<div id="wrapper">

        <div id="header">
        </div><!-- #header -->

        <div id="content">
        </div><!-- #content -->

        <div id="footer">
        </div><!-- #footer -->

    </div><!-- #wrapper -->

html,
body {
    margin:0;
    padding:0;
    height:100%;
}
#wrapper {
    min-height:100%;
    position:relative;
}
#header {
    background:#ededed;
    padding:10px;
}
#content {
    padding-bottom:100px; /* Height of the footer element */
}
#footer {
    background:#ffab62;
    width:100%;
    height:100px;
    position:absolute;
    bottom:0;
    left:0;
}

请检查以下网址。

http://cssreset.com/how-to-keep-footer-at-bottom-of-page-with-css/

页脚/元素可以相对于页面底部

1 个答案: