0

I have made the height of all the slides equal using these.

.slick-track
{
    display: flex !important;
}

.slick-slide
{
    height: inherit !important;
}

But when I applied these to the inner wrapper.

.slick-slide .item_wrapper
{
    height: inherit !important;
}

The inner-wrapper does not inherit the height. What is the problem with my css?

You can view the website at https://paljaya.goolive.xyz/ it is the news slider at the bottom. Here is the HTML for the inner wrapper.

<div class="item_wrapper">
    <div class="et_pb_module et_pb_image"><span class="et_pb_image_wrap"><img class="attachment-paljaya-berita-slider size-paljaya-berita-slider wp-post-image" src="https://paljaya.goolive.xyz/wp-content/uploads/2019/03/KULIAH-UMUM-448x336.jpeg" sizes="(max-width: 448px) 100vw, 448px" alt="" width="448" height="336" /></span></div>
    <div class="et_pb_module et_pb_text et_pb_text_align_left et_pb_bg_layout_light">
        <div class="et_pb_text_inner">
            <h4>kuliah umum</h4>
            <p>Memberikan Kuliah Umum Program Doktor (S3) Pendidikan Kependudukan dan Lingkungan Hidup (PKLH) Pascasarjana Universitas Negeri Jakarta Selasa, 12 Maret 2019, Direktur Utama PD PAL Jaya,</p>
        </div>
    </div>
    <div class="et_pb_button_module_wrapper et_pb_button_alignment_center et_pb_module"><a class="et_pb_button et_pb_bg_layout_light" tabindex="-1" href="https://paljaya.goolive.xyz/kuliah-umum/">Lebih lanjut</a></div>
</div>
strike_noir
  • 4,080
  • 11
  • 57
  • 100
  • https://stackoverflow.com/questions/49028877/slick-carousel-force-slides-to-have-the-same-height The accepted answer in this thread helped me. – strike_noir Jan 25 '21 at 22:21

1 Answers1

0

Because the number of words in your post is different, the heights are different And heights cannot be equalized by inheritance

.slick-slide .item_wrapper {
    height: 600px;
}
.et_berita_home .et_pb_text h4 {
    text-align: center;
    line-height: normal;
    color: #194f99;
    font-family: 'Rubik',sans-serif;
    font-weight: 500;
    font-size: 1rem;
    padding-bottom: 1.5rem;
    height: 50px;
    margin-bottom: 10px;
}
.et_berita_home .et_pb_text p {
    text-align: center;
    font-family: 'Rubik',sans-serif;
    font-size: 1rem;
    color: #000000;
    font-weight: 400;
    line-height: 1.6;
    height: 143px;
    overflow: hidden;
}

enter image description here