HTML/CSS : Can percentage width divs always completely fill their parent container (like a table cell does)?

Question

我想知道是否可以让不同百分比的 div 完全填充其父容器，就像表格单元格如何始终填充其行的宽度，即使百分比需要四舍五入也是如此。

这是使用表格的预期效果: http://jsfiddle.net/Tq9mJ/1/

以下是使用具有相同百分比的 div 时发生的情况: http://jsfiddle.net/fDVwB/1/

如果可能的话，我真的更愿意在我的特定应用程序中使用 div。

谢谢!

编辑:div 示例似乎在某些分辨率下有效。如果您在水平调整浏览器窗口大小时查看每个示例，则问题很明显。表格单元格不断填充，而 div 有时会留下空白空间。

Answer 1

在您的 div 示例中，在百分比末尾再添加几个“3”会有所帮助。

另一种 CSS 方法是使用 CSS3 flexbox 声明。 JSFiddle webkit-only example here.不幸的是，浏览器支持不是很好(没有 IE)，但它是实现您需要的一种非常干净的方式。

编辑:A good post by John Resig讨论了这个问题以及使其完美的困难，尽管它没有提供任何额外的指导。