将列表中的项目显示为列，具体取决于仅使用CSS的类

Question

我试图将列表中的项目显示为两个单独的列，而不添加额外的html包装或使用Jquery。

我在这里发表了一个例子http://codepen.io/danielschmid/pen/vwcta/?editors=010 注意：我只添加了左边和右边的边距，以便更好地体现我想要实现的目标。

我能想到的唯一方法是使用绝对位置，但我需要知道任何元素的大小，并将单个顶部位置添加为偏移量，如下所示：http://codepen.io/danielschmid/pen/aKBrc/

有什么想法吗？

感谢，

丹尼尔

Answer 1

您只需float其中一个，另一个需要使用overflow:hidden;触发其布局。

不应使用margin。

要使非浮动li站在right侧，您可以重置direction上的 ul 并将其重新设置为{{} 1}}。

<强> DEMO

---

为了进一步避免差距，遗憾的是你需要多次选择器进行测试，以确定是否有很多类型可以应用正确的负边距顶部。 DEMO 。如果li有数百个ul s：）

，这可能是无穷无尽的