18910140161

使用js将最后一行中的flexbox项缩放到相同宽度

顺晟科技

2021-07-09 11:29:36

70

我在FlexBox中有子元素。我希望他们是响应和更大宽度200px。它们可以很好地缩放,但由于最后一行的子行比其他行少,问题是它们的大小与其余行不同,显然我希望所有子行的尺寸都相同。

首先,我尝试使用网格,但后来我无法将最后一行的孩子居中。所以这不是解决办法。

我还读到一个类似的问题,答案是用FlexBox是不可能的。

那么,既然JavaScript是最后一个选项,那么如何使用它呢?

.wrapper { display: flex; flex-wrap: wrap; justify-content: center; } .item { height: 50px; flex: 30%; max-width: 200px; background: #ababab; border: 2px solid #000; } <div class="wrapper"> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> </div>


顺晟科技:

  • TAG:
相关文章
我们已经准备好了,你呢?
2024我们与您携手共赢,为您的企业形象保驾护航