Kevin Powell - Community•5mo ago

Slick slider inside a flex box

I have a slick-slider inside a two-column flexbox, but the slider is not respecting the parent container width, and I have to set its width to a certain value. Which is not good. I want it to be just 100% width of the parent. here is my markup, I'm using tailwind css:

<div class="flex max-w-[1000px]">
    <div class="basis-[480px]">
        <div class="slick-slider">
            <img src="https://placehold.co/1500x1500" />
            <img src="https://placehold.co/1500x1500" />
            <img src="https://placehold.co/1500x1500" />
            <img src="https://placehold.co/1500x1500" />
        </div>
    </div>
    <div class="flex-1">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quae, ipsam deleniti modi corrupti excepturi eius expedita inventore totam animi impedit laudantium temporibus veniam voluptatibus tenetur illum minus optio sed fuga.</div>
</div>

<div class="flex max-w-[1000px]">
    <div class="basis-[480px]">
        <div class="slick-slider">
            <img src="https://placehold.co/1500x1500" />
            <img src="https://placehold.co/1500x1500" />
            <img src="https://placehold.co/1500x1500" />
            <img src="https://placehold.co/1500x1500" />
        </div>
    </div>
    <div class="flex-1">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quae, ipsam deleniti modi corrupti excepturi eius expedita inventore totam animi impedit laudantium temporibus veniam voluptatibus tenetur illum minus optio sed fuga.</div>
</div>

0 Replies

No replies yetBe the first to reply to this messageJoin

Gaming

Programming

Slick slider inside a flex box