改头换面。结果- PHP

Question

嗨，我使用PHP从数据库中获取数据，使用while循环。已支付或未支付的类通过数据库字段值应用。付费会员每行有2名会员，每一行有3名无薪会员，这对我很有帮助。但一个小问题是，当付费会员结束时，我想要一个中断行，然后连续显示新的第3行中的无薪成员。我怎么能这么做？

<div class="main paid">
  ABC
</div>
<div class="main paid">
  ABC
</div>
<div class="main paid">
  ABC
</div>
<div class="main unpaid">
  ABC
</div>
<div class="main unpaid">
  ABC
</div>
<div class="main unpaid">
  ABC
</div>
<div class="main unpaid">
  ABC
</div>

CSS

.main{
  float:left;
  margin-bottom:30px;
  border:1px solid #ddd;
}
.paid{
  width:49%;
}
.unpaid{
  width:32%;
}

工频：https://jsfiddle.net/qzxyyo2x/1/

在这里，付费或无报酬是从数据库中获取的表值。宽度适用于它们。当付费成员结束时，我想添加一个“换行”，以便在下一行的一行中显示未支付的成员3。在这个问题中，我需要在3次结果后中断行距。如果付费会员是2,4,5,6或什么的。我需要在显示所有付费会员后中断线路。

提前谢谢..。

Answer 1

您可以使用一些清除代码来触发与clear: both;断开的未付费类，但是如果应用于整个.unpaid类，则所有未付费类都将处于各自的行中。

不正确演示：https://jsfiddle.net/qzxyyo2x/2/

一个快速的解决方案是一个名为.clearfix的新类。当unpaid类遵循paid类时，您可以使用它，但当unpaid类遵循unpaid类时，则不能使用它。这个逻辑必须在PHP中完成。

正确演示：https://jsfiddle.net/qzxyyo2x/3/

更优雅的解决方案是围绕每个行创建额外的div，但这可能涉及更改逻辑的更多内容，而不仅仅是一个类。