具有CSS的Pinterest样式布局,但水平堆叠而不是垂直堆叠

mel*_*dit 5 javascript css css3 packery masonry

我正在尝试创建一个不使用Packery或任何JS的pinterest样式的布局。我尝试使用CSS3列,但它们垂直堆叠。

在这里查看小提琴, https://jsfiddle.net/2otpzbgt/1/

column-count: 3;
Run Code Online (Sandbox Code Playgroud)

是我使用过的,卡片显示为1、6、11等。是否可以显示为1、2、3?

我要解决的目的是使用具有动态内容的网格布局,其中图像大小(高度)会变化(类似于pinterest),但是只有在事先知道图像高度的情况下,包装工才能进行布置。当您滚动时,我懒于加载图像并获取卡。

谢谢!

YuZ*_*uZA 1

删除column-fill: auto;,你的问题就解决了