css - 3 个 div，1 个固定宽度，1 个可变宽度（文本集），1 个扩展填充。可能的？

Question

我要做的是在左侧有一个固定宽度的 div，旁边有一个 div，其宽度由文本内容设置，最后一个 div 填充剩余的宽度。

这是我到目前为止所拥有的：

<div style="width: 100%">
  <div style="border: 1px solid black; height: 2px; float: left; width: 100px; ">
  </div>
  <div style="float: left; position: relative; top: -10px; padding-left: 5px; padding-right: 5px;">
    Text
  </div>
  <div style="border: 1px solid black; height: 2px; float: left; ">
  </div>
</div>

这里的例子：http: //jsfiddle.net/Xjxeu/

我需要这个例子，但第三个 div 延伸到右侧。

如果没有任何重大的“黑客”，这可能吗？

Answer 1

您可以使用display: table;

人们有时可能会不同意它是否是黑客行为，并且通常会看不起表格，但实际上这很好。你没有使用表格、tds 或任何东西，只是做一个div像table.

演示在这里

这是实现这一目标的最佳、最可靠的方法。

IE7及以下不支持。