自适应多列布局,行之间没有额外的间隙

时间:2018-01-06 12:42:14

标签: javascript html css flexbox

我正在与一种我称之为马赛克的东西挣扎,因为在我看来,这不是一个纯粹的自适应网格,但我不是UX / UI大师。

解释所需结果的最佳方法是blueprint,但我所取得的是regular grid layout并不符合我的需求。

简言之,我尝试用flexbox概念实现(display:flex; flex-direction:row; flex-wrap:wrap;)。

我认为我不需要分享我的代码,因为我选择了不恰当的方法。拜托,给我一个基本的想法。到目前为止,我已经得出结论,这只能通过javascript来实现。

1 个答案:

答案 0 :(得分:1)

您之后的布局设计类似于pinterest布局,使用flexbox实现布局设计非常令人沮丧。你可以咨询这个post,它问你同样的问题,并提供了几个解决方案/提示/技巧。我推荐的解决方案是使用Masonry,当然这涉及JavaScript。