html - 如何在流体容器元素内设置 div 宽度？

Question

我有一个容器元素：

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

在这个容器内，我有三个浮动的子 div left。第一个和第三个子 div 有width = 100px

如何设置第二个 div 的样式以占用剩余空间？

注意：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; }