5

我有以下页面布局:

<header></header>
<div id="content"></div>
<aside></aside>
<footer>
 <ul>
  <li></li>
 </ul>
</footer>

现在我想将页脚完全放在左下角:

text-align: left;
position: fixed;
bottom: 0;
margin: -16px -8px;

现在负边距不是最好的解决方案。有没有更好的方法将页脚直接定位在角落?

问候

4

4 回答 4

22

像这样写:

text-align: left;
position: fixed;
bottom: 0;
left:0
于 2012-04-25T13:15:37.733 回答
7

检查这个网站粘页脚

例子:

* {
    margin: 0;
}
html, body {
    height: 100%;
}
.wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -142px; /* the bottom margin is the negative value of the footer's height */
}
.footer, .push {
    height: 142px; /* .push must be the same height as .footer */
}
于 2012-04-25T13:16:51.597 回答
1

对我来说,它是这样工作的:

height: 58px;
position:relative;
bottom: -58px;

height注意和的相同值bottom。和postionrelative

于 2013-05-31T02:02:24.840 回答
0

HTML:

<div id="footer"></div>

CSS:

#footer {
   position:absolute;
   bottom:0;
   width:100%;
   height:60px;   /* Height of the footer */
   background:#6cf;
}
于 2014-02-22T12:27:04.477 回答