让div占用剩下的所有空间

时间:2012-12-06 13:20:51

标签: html css

我发现了几个有类似问题的帖子,但没有好的答案。 我在div中有两个div显示:table-row属性。 我的右边div需要修复:200px,左边必须占用剩余空间。

CSS: 

.dhPictureDiv{
float:left;
height:100%;
background-color:red;}

.dhInfoWrapper{
width:200px;
float:right;
background-color:yellow;
border: 0px solid red;}

.dhDivRow {
display: table-row;}

HTML:

<div class="dhDivRow><div class ="dhPictureDiv></div><div class ="dhInfoWrapper></div></div>

1 个答案:

答案 0 :(得分:4)

这已经被解决了,但是你去了:

http://jsfiddle.net/wu7TR/

我真的建议简化你的班级系统

.dhPictureDiv{
    background-color:red;
    height: 100px;
    display: table-cell;
    width: 100%;
}

.dhInfoWrapper{
    background-color:yellow;
    height: 100px;
    display: table-cell;
    min-width: 200px;
}

.dhDivRow {
    display: table;
}​