gpt4 book ai didi

html - Flexbox 在垂直堆叠的盒子上保持相同的高度

转载 作者:太空宇宙 更新时间:2023-11-04 13:28:03 25 4
gpt4 key购买 nike

<分区>

我有一堆看起来像大盒子的链接,内容和高度经常变化。使用 flexbox 使它们在每一行上具有相同的高度很容易。我使用 Bootstrap 网格布局,当每个盒子在较小的屏幕尺寸上垂直堆叠(每行一个)时,我无法让 flexbox 在它们上设置相同的高度。我希望我可以通过将 flow-directionrow 更改为 column 来解决问题,但是没有。

有什么方法可以不使用 javascript hack 来解决这个问题吗?

相关父容器CSS:

display: flex;
flex-direction: row;
flex-flow: row wrap;

子链接( flex )框:

display: flex;

伪代码:

<div class="flex-container>
<a href="/#" class="box col-lg-3 col-md-4 col-sm-6">
<h2>Test2</h2>
<div><img src="/ds" alt="Hi" /></div>
<div>sadsafmf sløfmkls</div>
</a>
<a href="/#" class="box col-lg-3 col-md-4 col-sm-6">
<h2>Test3</h2>
<div><img src="/ds" alt="Hi" /></div>
<div>sadsafmf sløfmkls skldfsd ffsf sdflsdf f sl as ad sad</div>
</a>
</div>

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com