2013-12-17 55 views
1

我有响应式设计一个博客。在这篇博客的文章页面中,我在每篇文章的末尾都有一个“Related Posts”div。调整只用CSS(响应式设计)多个div的高度

这些div的高度依赖,有时内容的变化,然后它打破了布局。希望下面的图像将更清楚地说明问题:

Layout break

我能够通过包装父容器内的div的每一行来解决这个问题,但是这种解决方案是不适合的,因为有不同数量的根据窗口的分辨率,按行分列相关的帖子。

我知道有些人通过比较每个div的高度,找到最高的一个修正的JavaScript这个问题,但我宁愿有一个纯CSS的解决方案。

任何想法?

+1

显示你的代码。 – Hiral

+0

'@ media'查询。 – Ranveer

+1

你可以使用'overflow-y:hidden;' - 然后你可以截断每一个的主体,以确保它不会以丑陋的方式被切断。 – brandonscript

回答

1

我知道你在问CSS解决方案,因为我不能评论,如果你想要一个jQuery解决方案,你可以使用masonary插件来满足你的需求。