尽管有柔性包装,如何使flexbox中的所有项目都具有相同的高度?

时间:2016-11-16 23:49:23

标签: css css3 flexbox

如何使弹性箱中的物品始终保持相同的高度?目前,我只能让它在同一行中使高度均匀,但下一行可能更高或更短。有没有办法纠正这个并使每一行都相同的高度?

main {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}
div {
  width: 33%;
  background-color: lightblue;
  margin-bottom: 10px;
}
p {
  line-height: 50px;
}
<main>
  <div><p>Random text that may or may not be the same everywhere</p></div>
  <div><p>Random text that may or may not be the same everywhere and making some of these divs taller then others</p></div>
  <div><p>Random text that may or may not be the same everywhere</p></div>
  <div><p>Random text that may or may not be the same everywhere</p></div>
  <div><p>Random text that may or may not be the same everywhere</p></div>
  <div><p>Random text that may or may not be the same everywhere</p></div>  
</main>

0 个答案:

没有答案