我有以下页面布局:
<header></header>
<div id="content"></div>
<aside></aside>
<footer>
<ul>
<li></li>
</ul>
</footer>
现在我想将页脚完全放在左下角:
text-align: left;
position: fixed;
bottom: 0;
margin: -16px -8px;
现在负边距不是最好的解决方案。有没有更好的方法将页脚直接定位在角落?
问候
像这样写:
text-align: left;
position: fixed;
bottom: 0;
left:0
检查这个网站粘页脚
例子:
* {
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 */
}
对我来说,它是这样工作的:
height: 58px;
position:relative;
bottom: -58px;
height
注意和的相同值bottom
。和postion
到relative
。
HTML:
<div id="footer"></div>
CSS:
#footer {
position:absolute;
bottom:0;
width:100%;
height:60px; /* Height of the footer */
background:#6cf;
}