我发现这篇文章做我想做的事:
但我使用的是三栏布局。我想澄清的是:两人每过第三次发帖,所以如果他们身高不同,他们将始终保持3到1排。
html:
<div class="post-listing">
<div class="post-item">
This text make the post-item different height.
</div>
<div class="post-item">
This text make the post-ite
我有两个媒体查询,它们都在一个带有项目符号的列表li标记中使用。问题是,它们清除了所有正在执行的第n个子进程(2n+1)和第n个子进程(3n+1),但在chrome设备视图中进行调试时,这两个进程在同一页面上被使用。所以网格是扭曲的,破坏了所有的2n+1和3n+1,我试着对查询重新排序,但仍然得不到我想要的结果。这发生在肖像视图中。
@media only screen
and (min-width: 768px)
and (max-width: 1024px) {
#products-list li:nth-child(3n+1) {
clear: left