Css 使用粘性页脚,可以';t获取要延伸到页脚的主要内容的背景
我读过一篇非常类似的帖子,尝试了所有的解决方案,但没有任何乐趣。这就是我所拥有的。我有一个全宽度(100%)的页眉和页脚空间和一个较小的宽度容器的网站。我使用了Ryan Fait粘性页脚,但是容器(带有白色背景)不能到达页脚,除非我只是放了一堆换行符,这违背了粘性页脚的目的 风格:Css 使用粘性页脚,可以';t获取要延伸到页脚的主要内容的背景,css,footer,sticky,Css,Footer,Sticky,我读过一篇非常类似的帖子,尝试了所有的解决方案,但没有任何乐趣。这就是我所拥有的。我有一个全宽度(100%)的页眉和页脚空间和一个较小的宽度容器的网站。我使用了Ryan Fait粘性页脚,但是容器(带有白色背景)不能到达页脚,除非我只是放了一堆换行符,这违背了粘性页脚的目的 风格: html, body { height: 100%;} body { margin:0; padding:0; } html { overflow: -moz-scrollbars-vertical; o
html, body {
height: 100%;}
body {
margin:0;
padding:0;
}
html {
overflow: -moz-scrollbars-vertical;
overflow-y: scroll;}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -30px;}
.container {
width:1050px;
margin: 0 auto 0 auto;
min-height: 100%;
height: auto !important;
height: 100%;
padding:0 25px 0 25px;
background-color:#FFF;
}
.footer, .push {
height: 30px;}
.footer {
background-color:#000;
width:100%;
height: 30px;}
以及html:
<div class="wrapper">
<div class="container">
/* content */
</div>
<!--end container-->
<div class="push"></div>
</div>
<!--end wrapper-->
<div class="footer">
/* footer */
</div>
<!--end footer-->
/*内容*/
/*页脚*/
您只需摆脱.wrapper
并移动。将推入容器中即可
看小提琴: