div布局常见的最小高度

时间:2014-08-17 12:10:30

标签: html css layout height

我希望我的div布局具有最小高度。还有左侧面板和内容。我可以为每个div设置相同的最小高度,但是当内容中的内容多于左侧面板时,内容将更高,而左侧面板将保持在最小高度。我希望他们一直处于同等高度。我已经创建了一个具有最小高度的div容器,其内部和左侧面板的height设置为100%,但是布局高于屏幕,即使容器为min {{1} } {低至height

以下是代码:

200px

2 个答案:

答案 0 :(得分:0)

这是每列(div)的高度相等的问题。看看这篇文章http://css-tricks.com/fluid-width-equal-height-columns/,他们解释了这样做的多种解决方案。但不幸的是,这不仅仅是直截了当的:(

更新1

就像他们也写在文章中一样,然后css flexbox(stretch)是解决这个问题的一个很好的解决方案,http://css-tricks.com/snippets/css/a-guide-to-flexbox/,唯一的缺点是并不是所有浏览器都支持(http://caniuse.com/flexbox

答案 1 :(得分:0)

您需要向div.content添加overflow属性。这个溢出属性需要有值滚动

div.content { width: 75%; height:100%; float: left; background: white; overflow:scroll;}