我使用的是 960 网格系统,我在保持页脚与网格以及页面底部对齐时遇到了问题。下面的代码是用 0px 的 margin-left 和 margin-right 计算的,而不是自动填充页面边缘之间的空间。
HTML
<footer class="botbar">
<small class="contact">name address information</small>
<small class="social">social media icons</small>
<small class="humans">human info</small>
<small class="copyright">© info</small>
</footer>
CSS
.botbar {
/*properties of container_16*/
margin-left:auto;
margin-right:auto;
width:960px;
/*my styling*/
clear: both;
position: absolute;
bottom: 0;}
.fcontact {
/*properties of prefix_1*/
padding-left:60px;
/*properties of container_16+grid_4*/
width:220px;
/*properties of grid_4*/
display:inline;
float:left;
margin-left:10px;
margin-right:10px;
.social {
/*properties of prefix_1*/
padding-left:60px;
/*properties of grid_4*/
display:inline;
float:left;
margin-left:10px;
margin-right:10px;
/*properties of container_16+grid_4*/
width:220px;
/*properties of suffix_1*/
padding-right:60px;}
.humans {
/*properties of grid_4*/
display:inline;
float:left;
margin-left:10px;
margin-right:10px;
/*properties of container_16+grid_4*/
width:220px;
/*properties of suffix_1*/
padding-right:60px;}
.copyright{
/*properties of grid_16*/
display:inline;
float:left;
margin-left:10px;
margin-right:10px;
/*properties of container_16+grid_16*/
width:960px;}
最佳答案
解决了它,能够做 .bottom 类并将其添加到页脚所以 <footer class="botbar bottom">
不需要 <div>
关于css - 页脚不在 960 网格中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11978867/