居中的固定寬度div填充空間

Question

我想用三個<div>創建一個布局，其中第二個（中間）div具有固定的寬度（例如300px）。 我的另外兩個<div>應該相等地填充父元素的其余部分。

我想用左右<div>的某種百分比來解決它，因此它是水平可縮放的。

<div>
    <div class="rest"></div>
    <div class="center"></div>
    <div class="rest"></div>
</div>

Answer 1

您可以將其他兩個<div>的width屬性設置為calc(50% - 150px); 。

div.rest {
    width: calc(50% - 150px);
    width: -webkit-calc(50% - 150px);
    width: -o-calc(50% - 150px);
    width: -moz-calc(50% - 150px);
}

請參閱JSFiddle上的示例 。