@andrey69rus

Как сделать так чтобы картинки были одинаковой высоты?

Здравствуйте, подскажите как сделать так чтобы картинки были одной высоты (обрезались либо чуть искажались, неважно)
С низу они все разные, надо выравнять
a4cee8e257d74907ac5bb19fae59e481.png
css
3e744ba381924abebaa131c998afd46b.png
html
9646ee30cdd54277b3855738b0cc9afb.png
  • Вопрос задан
  • 4452 просмотра
Пригласить эксперта
Ответы на вопрос 4
Либо сделать overflow:hidden на контейнер, либо вставить через background-image с параметром background-size: cover
Ответ написан
@tef
Смотря какой разброс по размерам. Если сильно большой то имеет смысл переконвертировать их на сервере.

А так, картинку вставляете фоном и задаёте позиционирование по центру. Примерно так.
img {
bacground-image: url(картинка.png);
background-position: 50%;
}


Есть ещё bacground-size: cover. Он растягивает фоновую картинку по ширине и высоте блока.
Ответ написан
Комментировать
webirus
@webirus
Тыжверстальщик! Наверстай мне упущенное...
<div>
<img>
</div>

.div {
width: 200px;
height: 300px;
}
.div img {
width: 100%;
height: 100%;
}

А нижний блок с отрицательным маргином.
Ответ написан
Комментировать
DEFUNK
@DEFUNK
internet explorer
.shortstory {
   height: вставь нужную высоту родителя в пикселях;
}

.shortstory img {
   height:100%;
}


Ну и в хтмл подправь, класс добавь перед ссылкой

<div class="shortstory">
    <a href="{full-link}">
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы