Как сверстать блок?

Question

[siteohio]

Добрый день.
Не подскажете как правильно сверстать данный блок?


Вроде простой блок, но если указывать картинкам одну высоту, то по ширине некоторые практически находятся на границе блоков.

Comments

[Ankhena]

1. Не задавать картинкам высоту.
2. Обернуть картинку в блок, div или figure.
3. Задавать картинкам максимальную ширину 100%

Можно ограничить высоту обертке, картинке задавать высоту и ширину 100% и object-fit contain.

[siteohio]

Ankhena, Спасибо большое!

Answer 1

[Арсений Матыцин]

Изображения ограничиваются по ширине, это грубо говоря стандарт таких решений. А вот, чтобы при всем этом они были в высоту нормальные, то пикчи нарезаются одинакового размера. Это самый безопасный способ, так как позволяет разобрать логотипы с разным визуальным весом.

Другой подход через object-fit, но там сразу смотри в поддержку браузерами.

Или через background-size:contain;, но чем дальше, тем хуже относительно первого корректного метода.