Изображения По-Разному Отображаются В Разных Браузерах
#1
Отправлено 07 Ноябрь 2015 - 20:23
http://sidimudobno.s...mod_id=87846745
В описании присутствуют несколько картинок, в том числе картинка с двумя скелетами. Её размер - 600х397
В Chrome все отображается корректно.
В IE и Firefox картинка со скелетами увеличена примерно в 2 раза. Причем только эта, остальные отображаются корректно.
Плюс в IE и Firefox маленькие дополнительные изображения товара сплющены.
Тема "Лето".
#2
Отправлено 09 Ноябрь 2015 - 18:33
customer8765 (07 Ноябрь 2015 - 20:23) писал:
http://sidimudobno.s...mod_id=87846745
В описании присутствуют несколько картинок, в том числе картинка с двумя скелетами. Её размер - 600х397
В Chrome все отображается корректно.
В IE и Firefox картинка со скелетами увеличена примерно в 2 раза. Причем только эта, остальные отображаются корректно.
Плюс в IE и Firefox маленькие дополнительные изображения товара сплющены.
Тема "Лето".
Попробуйте сделать следующее:
в main.css найдите код
img { max-width: 100%; height: auto; vertical-align: middle; border: 0; }и замените на
img { max-width: 100% !important; height: auto; vertical-align: middle; border: 0; }
#3
Отправлено 10 Ноябрь 2015 - 01:18
Danil (09 Ноябрь 2015 - 18:33) писал:
Попробуйте сделать следующее:
в main.css найдите код
img { max-width: 100%; height: auto; vertical-align: middle; border: 0; }и замените на
img { max-width: 100% !important; height: auto; vertical-align: middle; border: 0; }
Спасибо. Не помогло.
#6
Отправлено 01 Декабрь 2015 - 01:31
Danil (10 Ноябрь 2015 - 09:14) писал:
.IE img {width: 100%;}
.Firefox img {width: 100%;}
.Opera img {width: 100%;}
Обнаружился еще один косяк.
Если удалить эти строки, то окно отображения картинок на карточке товара в случае достаточно широкой картинки будет перекрывать описание товара (проверял в Firefox и IE).
А при отображении картинок в каталоге окно залезет на соседний товар.
А если строки оставить, перекрывать не будет, но проблема останется.
Скриншоты, иллюстрирующие оба варианта, прилагаю.
#7
Отправлено 03 Декабрь 2015 - 11:48
customer8765 (01 Декабрь 2015 - 01:31) писал:
Если удалить эти строки, то окно отображения картинок на карточке товара в случае достаточно широкой картинки будет перекрывать описание товара (проверял в Firefox и IE).
А при отображении картинок в каталоге окно залезет на соседний товар.
А если строки оставить, перекрывать не будет, но проблема останется.
Скриншоты, иллюстрирующие оба варианта, прилагаю.
Изменения Вам произвели, проверьте.
#9
Отправлено 03 Декабрь 2015 - 12:49
customer8765 (03 Декабрь 2015 - 12:06) писал:
Как мне перенести изменения туда?
.htmlDataBlock img { max-width: 100%; }
#10
Отправлено 03 Декабрь 2015 - 14:11
Danil (03 Декабрь 2015 - 12:49) писал:
.htmlDataBlock img { max-width: 100%; }
На самом деле, это не работает, поспешил я. Вот оба варианта, тестирую на одной и той же базе.
Первый вариант - изображения искажены:
http://sidimudobno.s...6745#show_tab_1
Второй вариант: изображения не искажены, но широкое изображение выходит за границу.
http://narasprodage....mod_id=89186745
Уж и не знаю, как вы проверяли.
#11
Отправлено 03 Декабрь 2015 - 14:22
customer8765 (03 Декабрь 2015 - 14:11) писал:
Первый вариант - изображения искажены:
http://sidimudobno.s...6745#show_tab_1
Второй вариант: изображения не искажены, но широкое изображение выходит за границу.
http://narasprodage....mod_id=89186745
Уж и не знаю, как вы проверяли.
Далее в main.css найдите код
.htmlDataBlock img { max-width: 100%; }и замените на
.htmlDataBlock img { max-width: 100%; width:auto; }
#12
Отправлено 03 Декабрь 2015 - 14:37
Danil (03 Декабрь 2015 - 14:22) писал:
Далее в main.css найдите код
.htmlDataBlock img { max-width: 100%; }и замените на
.htmlDataBlock img { max-width: 100%; width:auto; }
Но при этом на карточке товара сплюснуты маленькие изображения под окном просмотра товара и изображения в блоке "С этим товаром смотрят"! у вас это не наблюдается?
#13
Отправлено 03 Декабрь 2015 - 15:23
customer8765 (03 Декабрь 2015 - 14:37) писал:
Здравствуйте, попробуйте следующее:
в main.css после кода:
.IE img {width: 100%;}
добавьте код:
.IE .goods-image-icon {max-height:none !important;}
#14
Отправлено 03 Декабрь 2015 - 16:14
Юля123 (03 Декабрь 2015 - 15:23) писал:
в main.css после кода:
.IE img {width: 100%;}
добавьте код:
.IE .goods-image-icon {max-height:none !important;}
http://narasprodage....Kolennye-stulya
http://narasprodage....mod_id=89186745
#15
Отправлено 03 Декабрь 2015 - 17:52
customer8765 (03 Декабрь 2015 - 16:14) писал:
Здравствуйте, в конец main.css добавьте
.Firefox .products-grid .item .product-hover .product-image img { width: auto !important; display: block; margin: 0px auto; } .IE .products-grid .item .product-hover .product-image img { width: auto !important; display: block; margin: 0px auto; }
#16
Отправлено 04 Декабрь 2015 - 01:05
Ирина345 (03 Декабрь 2015 - 17:52) писал:
.Firefox .products-grid .item .product-hover .product-image img { width: auto !important; display: block; margin: 0px auto; } .IE .products-grid .item .product-hover .product-image img { width: auto !important; display: block; margin: 0px auto; }
http://narasprodage....mod_id=89186745
Только в Chrome нормально.
В IE маленькие изображения под окном просмотра товара разной высоты.
В Firefox маленькие изображения под окном просмотра товара сплющены, изображения в блоке "Вы смотрели" тоже:
http://narasprodage....Kolennye-stulya
#17
Отправлено 04 Декабрь 2015 - 04:27
.thumblist-box .thumblist li a img { max-width: 100%; }
попробуйте заменить на:
.thumblist-box .thumblist li a img { max-width: 100%; max-height: 70px; width: auto; }
#18
Отправлено 04 Декабрь 2015 - 10:41
Vaccina (04 Декабрь 2015 - 04:27) писал:
.thumblist-box .thumblist li a img { max-width: 100%; }
попробуйте заменить на:
.thumblist-box .thumblist li a img { max-width: 100%; max-height: 70px; width: auto; }
В Firefox изображения в блоке "Вы смотрели" сплющены
http://narasprodage....Kolennye-stulya
#19
#20
Отправлено 04 Декабрь 2015 - 11:54
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных