0
即时通讯尝试使用内联块制作网格式Tumblr主题,但出现了一些......并发症。帖子自动垂直对齐。如果它们的尺寸完全相同,那么这个问题就不会成为问题,但是这些帖子在高度上有所不同。总结一下,我希望创建两列不同高度的帖子,它们没有任何垂直对齐。我尝试了许多不同的解决方案,但似乎没有任何工作。使用内联块创建网格式Tumblr主题?
第一个链接是JSFIDDLE。
This is how it currently looks与how I would like it to look.
CSS
#entries {
width: 600px;
{block:PermalinkPage}width: 630px;{/block:PermalinkPage}
position: relative;
padding: 0px;
margin: 10px 0px 0px 0px;
}
.posts {
position: relative;
text-align: left;
background: {color:Posts};
width: 250px;
{block:PermalinkPage}width: 500px;{/block:PermalinkPage}
margin: 20px;
padding: 0px;
word-wrap: break-word;
display: inline-block;
clear: right;
}
.posts nth-child(even) {
float: right;
}
任何提示或可能的替代方案是最好的,因为我不能为我的生活想出解决办法。我开始认为垂直对齐只是内联块的固有特性?
这种布局是很难只用CSS来实现。像砌体(http://masonry.desandro.com/)的JavaScript插件可能会有所帮助。 – 2014-10-29 15:59:05
Metafizzy和Gridster是两个更好的图书馆 – 2014-10-29 18:55:48
@iharby:这个分号显然是我所有问题的答案,哈哈哈。现在它的所有工作都很漂亮。非常感谢! – Auburn 2014-10-29 19:54:21