为 owl-carousel 中使用的所有卡片设置相同的卡片高度

问题描述

我在轮播中使用卡片作为图像,并且我想让每张卡片的高度相同。
使用 h-100 类不起作用。

更改任何 p 标签内容会使卡片的大小与其他卡片不同,但我希望它具有固定大小。

我期待您能提出任何建议和解决方案。
谢谢。

下面是我的 HTML 代码

     <div class="wrapper">
             <div class="related-carousel section-padding owl-carousel">
                  <div class="card_new h-100" style="">
                    <img src="" class="card-img-top" alt="...">
                    <div class="card-body">
                      <a href="video_info.PHP"><p class="card-text">..........................</p></a>
                    </div>
                   </div> 
                   <div class="card_new h-100" style="">
                    <img src="" class="card-img-top" alt="...">
                    <div class="card-body">
                     <a href=""><p class="card-text">..............................</p></a>
                    </div>
                   </div> 
                  <div class="card_new h-100" style="">
                    <img src="" class="card-img-top" alt="...">
                    <div class="card-body">
                      <a href=""><p class="card-text">.........................</p></a>
                    </div>
                   </div>
        </div>
        </div>

解决方法

试试

    .owl-carousel {display: flex;}
.card_new{
    display: flex;
    flex: 1 0 auto;
    height: 100%;
}