我正在使用WP 3.5.1 ATM。我的目标是使文章宽度为300px，然后将它们浮动到左边，然后行在垂直和垂直方向上直接堆叠在彼此之下。水平对齐。我遇到的问题是，当它到达第二行时，它不会直接排在第一行的下方，而是水平排列。如果第一行中的一篇文章很长，而其他文章很短，则有时会在第一行和第二行之间留下巨大的垂直间隙。
我之前从未尝试过这样的布局，所以我想知道我是否能从那些有这些布局的指针中得到一些指示。我怎样才能做到这一点？或者也许是一个教程网站？我用Google搜索，但没有找到任何关于该方法的内容。
我的目标的例子是mysocialcloud.com，new.myspace.com，so.cl，特别是这个：http://www.eleventhemes.com/gridly/
感谢。
答案 0 :(得分：1)
如果您乐意使用CSS3，那么您可以将所有内容包装在div中，然后使用CSS列：
-moz-column-count: 3;
-moz-column-gap: 1em;
-webkit-column-count: 3;
-webkit-column-gap: 1em;
column-count: 3;
column-gap: 1em;
我制作了一个小提琴http://jsfiddle.net/DVfGP。
我用列css创建了一个div，然后用div创建了包含每个元素的div。我将以下css应用于元素：
display: inline-block;
width: 100%;
这使得所有元素保持在同一列中。希望这就是你所追求的。
答案 1 :(得分：1)
或者，如果您正在寻找能够提供更好的跨浏览器兼容性的基于JS的方法，请尝试jQuery Masonry。
按照正常方式浮动元素，但是Masonry将根据可用空间通过绝对定位重新定位元素。