height: 100% для картинок во flex-контейнере
280
07 июля 2017, 05:51
Решил сверстать адаптивную галерею картинок на flexbox. При этом столкнулся с неприятным багом - блоки с картинками отказываются правильно растягиваться по высоте и занимать всю площадь.
Решить это можно добавлением к img height:100% тогда все работает отлично только в Chrome и firefox , но не в Safari.
Вопрос: как заставить блоки с картинками растягиваться правильно по высоте во все браузерах?
Пример на Codepen
Answer 1
Можно решить проблему таким способом: нужно присвоить высоту .grid__item к img
$('.grid__item').each(function (i,v){
var h = $(v).height();
$(v).find('img').height(h);
});
-
21:12
Оборудование для ресторана: новинки профессиональной кухонной техники
-
22:17
-
22:13
Частный дом престарелых в Киеве: комфорт, забота и профессиональный уход
-
20:12
-
20:06
-
19:59
-
19:51
-
19:43
-
18:31
ТОП-10
- Почему SERVER_ADDR имеет не тот IP 48064 visits
- Как заменить $_SERVER[REMOTE_ADDR] на IP клиента в PHP за двумя Nginx? 30578 visits
- Хочу вывести несколько строк из массива в один div, выводит только много undefined; подскажите, что делать? 24017 visits
- Как через css изменить цвет png изображения? 10424 visits
- Blob video url download 10016 visits
- Php curl запрос через прокси с авторизацией 9292 visits
- Работа с captcha vk api 8158 visits
© "hostciti.net" 18.4.2025 | 16:32