http://jsfiddle.net/talmuda3/s9QyR/
footer {
margin-top: 1em;
width: 100%;
height: 20em;
position: relative;
bottom: 0;
left: 0;
}
离线网站的布局很棘手。内容溢出到页脚。 部分代码如上所述。
如何调整内容以使页脚保持在底部,并且内容在整个站点上延伸而不会与页脚重叠。请温柔。查看Chris Coyier网站上的任何提示 - 可能只是遗漏了一些东西。有人可以帮忙吗?
答案 0 :(得分:1)
您正在使用top: 12em
声明推送文章。您应该为页脚提供相同的属性,从而解决问题:http://jsfiddle.net/s9QyR/1/
答案 1 :(得分:0)
你还应该推出将页脚添加到正确位置的页脚top:12em;
。 demo
答案 2 :(得分:0)
我认为这就是你所追求的 - jsFiddle
article {
margin-top:12em;
width:80%;
height:100%;
margin-left: auto;
margin-right: auto;
margin-bottom: 3em;
padding: 1em;
z-index: 2;
background: transparent;
overflow: visible;
}
footer {
margin-top: 1em;
width: 100%;
height: 20em;
}
似乎改变定位打破了元素的自然流动。
您可能想尝试这种方法,以避免必须将所有内容放在线下。