如何替换循环（'float：left'，'float：right'）来使用纯css？

Question

有没有办法替换cycle('float: left', 'float: right')，以便不使用cycle帮助程序，而是可以使用纯css类。我需要在一列内左右对齐div。使用循环会导致缓存出现一些困难，因此最好使用静态样式。

<div class="userCards">
    <div class="singleCard <%= cycle 'cardLeft', 'cardRight' %>">
        <!-- content -->
    </div>
</div>

请注意，userCard具有固定的高度，overflow: hidden和width: 48%。

Answer 1

听起来像nth-child()选择器的工作：

.userCards .singleCard:nth-child(odd) {
  float: left;
}

.userCards .singleCard:nth-child(even) {
  float: right;
}