css - 中间 div 100% 宽度

Question

我如何让我的中间 div 占用剩余的宽度空间，但仍留在其他 2 个 div 旁边的位置？ 另外，如果我删除两侧的 2 个 div 中的任何一个，主 div 应该只占用剩下的空间吗？

代码:

<div class="row-fluid">
<div class="span12">
    <div class="sidebar">1</div>
    <div class="content-box">2</div>
    <div class="sidebar">3</div>
</div>
</div>

http://jsfiddle.net/U3Hr5/2/

Answer 1

我的建议是使用表格，因为您希望所有表格都位于同一行但具有自己的高度。 HTML:

<div class="row-fluid">
<table style="width: 100%">
    <tr>
        <td class="sidebar">1</td>
        <td class="content-box">2</td>
        <td class="sidebar">3</td>
    </tr>
</table>

CSS:

.sidebar {
    width:225px;
    background-color:blue;
}
.content-box {
    background-color:red;
}

这是 fiddle 编辑: http://jsfiddle.net/mDpEX/

//翻转