KPC
Kevin Powell - Community•7mo ago
Nibelung Valesti

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

Did you find this page helpful?