css - 图片布局空间大的div位置

Question

我的 CSS 布局有问题。没有使用 Javascript，因为我不知道如何动态定位 div(帖子)。 Div 有空格和线条，但由于 div 的大小不同，我不想要这些线条。

请看这些照片；

• > http://postimage.org/image/hibb48iq3/
• > http://postimage.org/image/6h9b8mpt9/

我不想要那个指定的大空间。我正在尝试在 CSS 中使用各种显示属性，但没有改变那么大的空间。我的 CSS 代码是这样的:

#post {
    box-shadow: 0px 1px 3px rgba(34, 25, 25, 0.4);
    background: #fbffff;
    color: #6d6d6d;
    margin: 10px 0;
    padding: 15px;
    box-sizing: border-box;
    font-family: tahoma;
    line-height: 20px;
    width: 30%;
    float: right;
}

如果有人使用 CSS 或 Javascript 有一些解决方案，那将会很有帮助。我的代码在 Ruby on Rails 中。

我在 JS fiddle 中做了一个示例来解决:http://jsfiddle.net/DLKP6/

Answer 1

您正在寻找动态网格布局 - here you can find a repository of solutions .

如前所述，我建议您查看 Masonry , 和 Wookmark plugin