如何替换循环('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;
}