没有包装的行清除＆＃39;行＆＃39;容器

Question

有没有办法在每行没有包装容器的行的最后一个元素之后清除？ 里面的列大小会有所不同，有一个'last'类，我可以在div关闭后清除吗？我无法在标记中添加任何内容。

标记：

<div class="grid-row">
   <div class="col-6">
     col 6   
  </div>
  <div class="col-6 last">
     col 6   
  </div> 
 <!-- Need to clear here -->
  <div class="col-4">
      col 4   
  </div>
  <div class="col-4">
      col 4  
  </div>
  <div class="col-4 last">
      col 4  
  </div>
  <!-- Need to clear here -->
</div> 

Answer 1

对于拥有以下兄弟姐妹的每个.last列（不是最后一个孩子），您只需在下一个兄弟中引入许可：

.grid-row .last + div {
    clear: both;
}

至于最后一个孩子，您可以在:after上使用clearfix .grid-row伪元素：

.grid-row:after {
    content: '';
    display: table;
    clear: both;
}

或者你可以让.grid-row之后的元素引入许可，与上面的第一条CSS规则大致相同。