如何使行内块元素填充行的其余部分?
使用CSS和两个内联块(或其他)DIV标签而不是使用表,是否有可能这样做? 表格版本是这样的(添加了边框,您可以看到它): <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head></head> <body> <table style="width:100%;"> <tr> <td style="border:1px solid black;width:100px;height:10px;"></td> <td style="border:1px solid black;height:10px;"></td> </tr> </table> </body> </html> 它会产生带有固定宽度(而不是百分比宽度)的左列,并且右列会扩展以填充行上的剩余空间。听起来很简单,对吧?此外,由于没有任何东西“浮动”,因此父容器的高度会适当扩展以包含内容的高度。 --BEGIN RANT-- 我已经看到了带有固定宽度的边栏的多列布局的“清晰修复”和“圣杯”实现,它们很烂而且很复杂。他们颠倒了元素的顺序,使用了百分比宽度,或者使用了浮点数,负边距,并且“ left”,“ right”和“ margin”属性之间的关系很复杂。此外,布局是亚像素敏感的,因此即使添加边框,填充或边距的单个像素也将破坏整个布局,并将整列换行发送到下一行。例如,即使您尝试做一些简单的事情(例如,将4个元素放在一行上,每个元素的宽度都设置为25%),舍入误差也是一个问题。 -结束兰特- 我曾尝试使用“ inline-block”和“ white-space:nowrap;”,但问题是我无法获取第二个元素来填充行中的剩余空间。在某些情况下,可以将宽度设置为“ width:100%-(LeftColumWidth)px”,但是实际上不支持在width属性中执行计算。