Slick slider sets image width to 0, how to fix?

Question

Slick

There is a markup like this

<div class="popup__slider slider ">
   <img src="img/ships/avrora/avatar.jpg" alt="Слайд" class="slider__img">
   <img src="img/ships/avrora/avatar.jpg" alt="Слайд" class="slider__img">
   <img src="img/ships/avrora/avatar.jpg" alt="Слайд" class="slider__img">
                
</div>

And here is such JS

$('.popup__slider').slick({
        arrows: false,
        slidesToShow: 1,
        dots: true

    });

In the end, this is what happens. Wrappers and images have width: 0 set. And if you click on one of the dots, the pictures will appear, but everything will look inadequate.

Answer 1

Make sure the slick-list class is set to 100% width

.slick-list {
    width: 100%;
}