Question

我有一些过滤器列表。我的目标是让它们显示为彼此相邻的三行（cb1＆amp; 2 / cb3＆amp; 4 / cb5）。

＆＃34; checkbox_container＆＃34; -blocks是通过CMS自动创建的。因此，我不能在其间添加div来创建列。

我可以通过绝对定位来做到这一点，但是如果过滤器将来发生变化会导致布局问题，我宁愿不这样做。

有没有人明白如何用CSS和/或JS实现这个目标？

这是CMS输出的复选框容器的基本结构。

<div class="checkboxes">
  <div class="checkbox_container cb01">
    <div class="entry"></div>
  </div>
  <div class="checkbox_container cb02">
    <div class="entry"></div>
    <div class="entry"></div>
  </div>
  <div class="checkbox_container cb03">
    <div class="entry"></div>
    <div class="entry"></div>
  </div>
  <div class="checkbox_container cb04">
    <div class="entry"></div>
  </div>
  <div class="checkbox_container cb05">
    <div class="entry"></div>
    <div class="entry"></div>
    <div class="entry"></div>
    <div class="entry"></div>
  </div>
</div>

Answer 1

这里你去jsfiddle.net/50t7oLga/1，使用带有方向列的flexbox并给包装器一个高度来强制项目包装

需要CSS布局建议

1 个答案: