html - CSS 内容宽度/ float 问题

Question

我有一个问题，我试图制作一个本身宽度会有所不同的内容框。在这个内容框内还有另外 2 个框，其中一个我知道确切的宽度，另一个我不知道。问题是我希望能够设置我知道的内容的宽度，然后让其他内容占据剩余的宽度(我不知道)。如果您查看此页面:

http://ryanzec.com/tests/test1/ :最好使用任何浏览器的最新版本查看此内容。

第 3、5 和最后一个是不好的，因为我不知道框中的内容(带有文本的那个)占用了不止一行，这插入了其他内容(带有按钮)向下。我希望按钮始终位于顶部文本的旁边。我怎样才能干净地获得这种效果？

请注意，我对浏览器支持的关注是每个浏览器的最新版本。 IE 8 不是一个高优先级的问题，尽管我希望它看起来像下降(我不在乎它没有圆 Angular 或类似的小东西)。我不太关心 IE 7//6(就目前而言，这在那些浏览器中看起来像 cray)。

Answer 1

您可以在源代码中将 .controls 移动到 .title 之前，然后从 .title 中删除 float 。这将使控件和标题保持在同一行，但会导致标题在控件下换行。要停止换行，您可以给 .title 一个等于 .controls 宽度的右边距。