像桌子一样并排分开

Mau*_*ano 4 html css

我希望并排有两个div,并且只为一个div定义宽度.

然后,另一个div将自动适合父容器.我怎么做?

HTML:

<div class="parent">
    <div class="first"></div>
    <div class="last"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS:

.parent {
    width: 100%;
}
.parent .first {
    width: 300px;
    float: left;
    background-color: red;
}
.parent .last {
    width: auto;
    float: right;
    background-color: blue;
}
Run Code Online (Sandbox Code Playgroud)

谢谢.

Exp*_*lls 6

不要float第二个div.只有第一个需要浮动.

http://jsfiddle.net/zLef8/

  • @MaurícioGiordano因为当你浮动一个元素时,它只会像它的内容一样宽,除非你指定一个宽度,即使它是`display:block`.`display:block`元素填充行中所有可用的宽度 (2认同)