Slick slider задаёт картинкам width 0, как исправить?

Question

[naraxiss]

Есть вот такая разметка

<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>

И вот такой JS

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

    });

В итоге вот такое получается. У обёртки и у картинок width: 0 задаётся. А если нажать на одну из точек, то картинки появятся, но всё будет выглядеть неодекватно.

Comments

[Игорь Ефремов]

Возможно, что скрипт слайдера срабатывает до факта загрузки картинок браузером, в таком случае помогает обернуть скрипт $(document).ready(function(){});

Answer 1

[Вячеслав Шевченко]

Проверь чтобы для класса slick-list была задана ширина 100%

.slick-list {
    width: 100%;
}

Comments

[CrazyCalm]

Это то тут причем вообще? Скрипт напрямую к картинкам прописываеи