我已经尝试了互联网上的所有解决方案,但都不适合我。我想在 'wrap' div 中创建一个 'content' div 和一个 'side' div,并将 'wrap' 的下方设为页脚 div。如果我在“内容”中添加更多文本,div 会增长并适合它的内容,然后将页脚向下推。 “边”也一样。我制作了一个 jsfiddle.net/h97t9me4/4 来说明,但它使用的是表格而不是 div。我怎样才能做到这一点?谢谢。
最佳答案
这是我想出的:
http://codepen.io/anon/pen/wDnsr
HTML
<div class="content">
<p>This is the content</p>
</div>
<div class="side">
<p>This is the side</p>
</div>
<div class="footer">
<p>This is the footer</p>
</div>
</div>
CSS
*, *:before, *:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.content {
width: 75%;
padding: 1em;
float: left;
}
.side {
width: 25%;
padding: 1em;
float: left;
}
.footer {
width: 100%;
padding: 1em;
clear: left;
}
关于html - 拉伸(stretch) div 以适应它的内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25271880/