html - 制作一个流体 div 和另一个填充剩余空间

Question

有没有办法让这样的东西在 CSS 和 HTML 上工作:

有2个div，都是未知宽度，一个动态扩展，另一个填充剩余空间，如下:

结构非常基本:

<div class="parent">
    <div class="filler"></div>
    <div class="dynamic"></div>
</div>

.filler 将包含文本，.dynamic 将接收应在一行中显示的元素(其他 html 结构)。

这可能吗？

Answer 1

您可以在子 div 上使用 display:table-cell，在填充 div 上使用 width:100%。

#filler {
    display:table-cell;
    width:100%;
}
#dynamic {
    display:table-cell;
}

http://jsfiddle.net/htvr9/