Question

我希望在过去的好日子里有两列表布局。它适用于http://paulisageek.com/resume并且与以下内容完美配合：

.dates {
  float:right;
  width:171px;
}

但我确信我会打破更新的大小（以及不同的字体，浏览器和字体大小等）。

有没有办法让第二列自动调整大小而不强制宽度（或使用javascript）？ CSS3会有办法吗？

Answer 1

为日期列指定最小宽度和最大宽度，而不是固定宽度。这为您提供了灵活性，但确保您的设计不会破坏：

.dates {
  float:right;
  min-width:171px;
  max-width:300px;
}

请注意，min-width和max-width不包括填充，边框或边距。

另一种可能性是使日期对齐并显示内联：

.dates p{
  text-align:right;
  display:inline;
}

这样你就不需要一个单独的日期div。

...或者，如果你想成为超级前沿并确保你的布局在IE中中断，你可以使用new CSS3 columns（这里不推荐，但仍然值得一读）

Answer 2

你在这里得到的东西非常好用桌子很容易。它不仅令人难以置信地向后兼容。在“纯粹的”CSS中，这很难。您可以使其中一列变宽，但不能同时变宽。如果你真的需要它，坚持使用表格（不论语义HTML狂热者可能会说什么）。

Answer 3

是的，这是可能的。要搜索的关键字是液体列。例如，this处理整个布局，但点数相同。