添加浮点数：左中断列表

Question

我有一个名为“计划”的视觉元素，它在html页面中列出。每个“计划”都有一张小桌子和一张图片，我想并排显示。没有任何造型它看起来像这样：http://jsfiddle.net/DCTwd/1/

我以为我可以在表和图像中使用float: left使它们显示在同一行中，但这是行不通的。 li内部不可以使用float: left吗？否则我怎么能做到这一点？

Answer 1

不需要古代float:left;，当display:inline-block;是你最好的朋友！

your updated jsFiddle。这是一个非常简单的例子，所以你的实际CSS应该涉及基于类的而不是基于元素的CSS，但它可以得到满足。

请注意zoom:1; *display:inline;对于美学的IE7-和vertical-align:middle;的回退。你也可以使用top或bottom，无论你为什么工作。

Answer 2

我会用一个inline-table这是很好的支持为CSS2.1的：

table { 
    display: inline-table; 
} 

我在建立一个演示：http://jsfiddle.net/audetwebdesign/cYDUC/

你需要注意的填充和利润率在你的ul和li元素并隐藏左边的子弹（除非要显示它）。

如果您需要支持IE7，则可以使用display: inline并相应地调整元素周围的填充和边距。