如何在流體容器元件內設置div寬度？

Question

我有一個容器元素：

div#container {
  width:100%;
  height: 20px;
  overflow:hidden"
}

這里面的容器，我有漂浮三個子div的left 。 第一個和第三個子div的width = 100px

如何設置第二個div的樣式，使其占用剩余空間？

nb：僅css ，無javascript 。

Answer 1

如果您可以將float:right移到第三個div，則建議您采用以下布局：

div#container { width:100%; height: 20px; overflow:hidden;display:table; }
div#div1 { float:left; width:100px; display:table-cell; }
div#div2 { margin-left:100px; margin-right:100px; width:100%; display:table-cell; }
div#div3 { float:right; width:100px; display:table-cell; }