css-float - CSS3 显示 : table-cell & float?

Question

我有一个很长的 div 容器设置为 display:table和其中的 & div 设置为 display:table-cell; vertical-align: middle .

我对垂直对齐的结果非常满意，但是:

我不知道这3个div的宽度，

我希望其中一个位于 div 容器的最右侧(当然减去填充)，

float: right不适用于 display: table-cell .

这是一个示例(我想将金色 div float 到右侧)。我不能使用JS。如果 IE7 不可能，我需要它在 IE7+ 或 IE8+ 中工作。任何提示/想法？

http://jsfiddle.net/cZ7Th/2/

Answer 1

我不知道这是否适用于 IE7 或 8，但我已经通过结合 width: 1px 做到了这一点。 , width: auto和 white-space: nowrap .将表格布局中的所有单元格定义为一像素宽，但防止换行；然后在要向右 float 的单元格之前添加一个空的填充单元格。

http://jsfiddle.net/wZ96P/

似乎至少适用于 Chrome、Opera、Firefox 和 IE 的现代版本。