CSS / JS：左右对齐瓷砖

Question

我的缩略图始终是相同的图像宽度，以及可能的不同图像高度。

现在，我想将它们全部对齐，以便没有“差距”。在我的缩略图/瓷砖概述。我现在只剩下他们了。但是这给出了下面的结果。

是否有可用于此的JS库？ （=对齐宽度相同，高度不同，没有间隙的瓷砖？）

Answer 1

你正在寻找的是一个名为Masonry的jQuery插件。它虽然是一种痛苦而闻名。根据应用程序的规模，我会使用CSS3或flex-box替代方案。

jQuery Masonry - http://masonry.desandro.com/

CSS3砌体 - http://w3bits.com/css-masonry/

Flex-Box Masonry - http://thenewcode.com/844/Easy-Masonry-Layout-With-Flexbox

希望这些链接有所帮助。 ：）

Answer 2

仍然不太好的专栏可以帮助你.. Can i use column?

＆＃13;

＆＃13;

size()

＆＃13;

div.wrapper {
  -webkit-columns: 300px 2;
  -moz-columns: 300px 2;
  columns: 300px 2;
  -webkit-column-rule: 1px dotted rgb(0, 0, 0);
  -moz-column-rule: 1px dotted rgb(0, 0, 0);
  column-rule: 1px dotted rgb(0, 0, 0);
  text-align: center;
}

＆＃13;

＆＃13;

＆＃13;