Question

При проверке на Адаптивность страниц Интернет Магазина, при двух и более колонках товара на странице - появляется горизонтальная прокрутка на малых экранах (320 например). Ширина Превью изображения товара стоит по умолчанию 150х150.

Если в настройках выставить отображение в 1 колонку - всё нормально выписывается.

Задача в итоге получить от Гугла, Яндекса "Галочку" о том что сайт корректно отображается на всех устройствах.

Есть ли решение это исправить, настроить...? Заранее благодарю.

 

Answer 1

В стилях строка номер 521:

.gphoto,.smiles img{max-width:inherit;}

вместо выделенного красным пропишите 100%

Comments

Изменил .gphoto,.smiles img{max-width:100%;} К сожалению результ тот же - горизонтальная прокрутка на ширине 320, именно когда активирую 2 колонки товаров на странице. Так же при 100% При открытии страницы с каким-либо товаром пропадает фото.

---

mitinskaya37,

Можно сделать по другому, в стили пропишите в самый низ условие:

@media screen and (min-width: 320px) and (max-width: 359px) { 
.goods-list td {
    width: 100%!important;
    float: left;
}
}

---

Yuri_Geruk,

Решено!

Спасибо Друг,  Yuri_Geruk!

Добавил, как вы подсказали:

@media screen and (min-width: 320px) and (max-width: 359px) { 
.goods-list td {
    width: 100%!important;
    float: left;
}
}

---

max-width:inherit;} вернул на место, так как при открытии страницы товара при шририне экранов устройств от 1024 и шире пропадали изображения вообще. с чем связано, так и непонял. Сейчас всё как надо.