html - 向左浮动无法正常工作

Question

我有这些 html 标签

<div class="items-row cols-3 row-0">
  <div class="item column-1"></div>
  <div class="item column-2"></div>
  <div class="item column-3"></div>
</div>
<div class="items-row cols-3 row-1">
  <div class="item column-1"></div>
  <div class="item column-2"></div>
  <div class="item column-3"></div>
</div>
<div class="items-row cols-3 row-2">
  <div class="item column-1"></div>
  <div class="item column-2"></div>
  <div class="item column-3"></div>
</div>

我想像这样向左浮动

.items-row{float: left;} /*tried !important also*/

test site

但这并没有像它应该的那样向左浮动。如果这是宽度问题，这里是 demo无论如何，其中的主要 div 宽度较小，但向左浮动。

Answer 1

我认为你应该关闭你的 <div>标签!

参见 fiddle .

HTML:

<div class="items-row cols-3 row-0">
    <div class="item column-1">1</div>
    <div class="item column-2">2</div>
    <div class="item column-3">3</div>
</div>
<div class="items-row cols-3 row-1">
    <div class="item column-1">1</div>
    <div class="item column-2">2</div>
    <div class="item column-3">3</div>
</div>
<div class="items-row cols-3 row-2">
  <div class="item column-1">1</div>
  <div class="item column-2">2</div>
  <div class="item column-3">3</div>
</div>