我尝试了所有粘性页脚 CCS 示例。他们都工作正常。但是，我有一个问题。假设我有这个:
<div id="wrap">
<div id="bodyleft">left</div>
<div id="bodyright">right</div>
<div id="footer">footer</div>
</div>
因此，如果我为 #bodyleft 设置了 height 100%，边框将不会延伸到视口(viewport)的末端直至页脚。它只会覆盖一行内容。
无论是1行还是10行，我都希望边框延伸到页尾。
有什么想法吗？
谢谢!
玛丽亚
编辑:
<body>
<div id="wrap">
<div id="bodyleft">on left</div>
<div id="bodyright">
some text on right<br />
</div>
</div>
<div id="footer">footer </div>
</body>
</html>
* { margin:0px; padding:0px; }
html, body {height: 100%;}
#wrap {min-height: 100%;}
#footer {
position: fixed;
bottom: 0;
background-color: #f00;
height: 20px;
width: 100%;
margin-top:-20px; /* negative value of footer height */
}
#bodyleft{
width:222px;
float:left;
border:1px solid black;
overflow:auto;
padding-bottom:20px;
}
#bodyright{
width:777px;
float:right;
border:1px solid black;
overflow:auto;
padding-bottom:20px;
}
最佳答案
我可能错了，但我认为 100% 只会高到足以显示 div 的内容。我认为您可能不得不使用最小高度。
关于css - 在粘性页脚上，如何使 div 边框延伸到页面末尾直至页脚？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/3527006/