Изображение слайдера на веб-сайте начальной загрузки не подходит для просмотра на мобильных устройствах

avatar
BOOKTHEPARTY
1 июля 2021 в 16:19
97
1
1

У меня есть слайдер на моем сайте начальной загрузки, ссылка на сайт здесь

Изображение слайдера отлично работает на настольных устройствах, но на мобильных устройствах оно не помещается на экране. Я сделал следующее css:

@media only screen and (max-width: 600px)
.n2-ss-slider [data-mode=fill] .n2-ss-slide-background-image {
    background-size: 400px !important;
}

Вчера этот css работал нормально, теперь он не работает, может ли кто-нибудь сказать мне, как сделать так, чтобы изображение слайдера помещалось на экран в мобильном представлении, заранее спасибо

Источник

Ответы (1)

avatar
JstnPwll
1 июля 2021 в 16:50
1

Насколько я могу судить, это CSS, ответственный за создание изображений cover (т. е. покрытие всей панели, благодаря чему высота изображения соответствует высоте панели, отодвигая левый и правый края экрана) .

.n2-ss-slider .n2-ss-slide-background-image img {
    object-fit: cover;
}

Если вы добавите этот CSS, вы сможете переопределить его:

.n2-ss-slider .n2-ss-slide-background-image img {
    object-fit: fill;
}