Почему не отображается галерея в мобильной версии?

Question

[Рома]

Всем доброго вечера. Изломал мозг, не понимаю в чем проблема. На сайте есть изображения товара в галереи oceanshoes.ru/product/yeezy-boost-750-light-greygum , но при маленьком разрешении она куда-то пропадает, а в основной версии появляется снова. Кто может подсказать, в чем проблема? Заранее огромное спасибо!!!

Comments

[Алексей Зуев]

stackoverflow.com/questions/23273506/how-can-i-cha...

[Рома]

Алексей Зуев: Алексей, можете объяснить более детальней, голова едет, целыми днями изучаю данный вопрос. В долгу не останусь

Answer 1

[Алексей Зуев]

Попробуйте добавить стиль

.slick-list {
  width: 100%;
}

Comments

[Рома]

Огромнейшее Вам спасибо!!! Спасли нас!)

[Алексей Зуев]

Рома: Не за что!)

Answer 2

[MihailDonskoy]

проблема в медиазапросе у тебя там стоит media (min-width: 768px),сделай его меньше и будет тебе счастье,просто адаптируй его под меньшее разрешение

Comments

[Рома]

Какой медиа запрос, можно поконкретней?) не могу найти его..

[MihailDonskoy]

@media(min-width: 768px) у тебя минимальная ширина 768px под нее у тебя задана ширина элемента в %(т.е твоего слайдера),а когда ты делаешь ширину меньше,то там уже уже media не работает(т.к. работает оно при минимальной ширине 768px)и у тебя происходит выпадение элемента из - за того что он больше чем размер (ширина) твоего окна.Поэтому тебе надо найти строки где у тебя прописаны media и создать новый медиазапрос под 480px и 320px.Ты можешь сделать так прописать первый от твоего 768 до 480 media only screen and (min-device-width : 480px) and (max-device-width : 768px)или @media(min-width : 480px) and (max-width : 768px) и под него прописать css тех селекторов,которые криво отображаются и тоже самое сделать от 480 до 320 @media(min-width : 320px) and (max-width : 480px)и под него прописать css тех селекторов,которые криво отображаются.Ну или пойти по кривому пути не полного решения всей проблемы,но по крайней мере поймешь о чем я говорю,просто возьми и найди строку в css @media(min-width: 768px) и поменяй 768 на 320 --->@media(min-width: 320px) и увидешь,что слайдер будет на месте и он будет норм отображаться,а шрифты перепрыгнут,так как не будут помещаться в блоках,поэтому то и нужно прописать в тех запросах о которых я сказал ранее им размеры меньше,ну кароч адаптировать с помощью css под эти размеры все что порассыпалось.