带有 Bourbon / Neat 的多列流动文本

Question

我有一个 rails 应用程序，可将可变数量的 <li>#{content}</li> 组件输出到 HTML 页面。

这些元素不大，不会填满整个屏幕。我希望列表环绕并分成多列，最好基于高度。

即。 (the height of the complete <ul> / 2) = height of new multi column setup

因此，当第一个元素下沉到左侧栏底部下方时，它会自动移动到右侧栏顶部，列表从那里开始流动。

是否有一种干净的方法来执行此操作 - 内置 bourbon/neat 还是我需要使用 jquery/columnizer？

Answer 1

我发现这个问题线程有助于我自己解决这个问题： thoughtbot/neat/issues/107

为了个人使用，我将想法改编为：

  ul {
     @include span-columns(12);
     @include omega();
     &>li {
        @include span-columns(2 of 12);
        @include omega(n);
     }
  }