2 div之间的div宽度100%

时间:2012-07-24 06:29:49

标签: css html

在我的页面上,我有这样的div结构。

- 身体上有2个div。前20%宽度,第二宽80%宽度。 - 在第一个div中有3个div。第一个浮在左边:11px宽,第三个浮在右边:22px宽。我想在第1和第3 div之间放置第二个div,占据剩余宽度的100%。

我不能像这样制作第二个div。我该怎么办?

1 个答案:

答案 0 :(得分:5)

像这样写:

<强> HTML

<div class="firstdiv">
    <div class="first">1</div>
    <div class="third">3</div>
    <div class="second">2</div>
</div>
<div class="secdiv">80%</div>

<强> CSS

.firstdiv{
    width:20%;
    float:left;
    background:red;
    }
    .secdiv{
     overflow:hidden;
     background:green;
    }

.first{
    float:left;
    width:11px;
    background:yellow;
}
.third{
    float:right;
    width:22px;
    background:pink;
}
.second{
    overflow:hidden;
    background:blue;
}

选中此fiddle