一组从大到小排好序的数据，生成div，宽度统一，高度不统一出现间隙

data: [
      { title: '美食', value: 99 },
      { title: '才艺', value: 96 },
      { title: '搞笑', value: 91 },
      { title: '旅行', value: 86 },
      { title: '游戏', value: 82 },
      { title: '颜值', value: 77 },
      { title: '评测', value: 73 },
      { title: '是的', value: 67 },
      { title: '斯诺克', value: 60 },
      { title: '美妆', value: 57 },
      { title: '科技', value: 52 },
      { title: '健身', value: 47 },
      { title: '生活', value: 41 },
      { title: '哈哈', value: 38 },
      { title: '养生保健', value: 33 },
      { title: '综合', value: 31 },
      { title: '新闻', value: 22 },
      { title: '健身', value: 15 },
      { title: '足球', value: 11 },
      { title: '篮球', value: 7 },
    ]

这样一组数据，在一个宽度300px的容器内，每一个item的宽度固定60px，高度的值为value值，高度最小值是20px,最后出来的效果， 因为元素是顶部对齐的，所有高度小的元素，和上一行的元素出现了间隙，请问有什么好的思路啊