Как картинку вставить в такой div?

Question

[Twitt]

Есть много картинок у которых разное разрешение, и когда я вывожу их в ряд, то начинаются "танцы", одна выше другой, другая ниже третьей и т.д.
Нужна помощь, как встроить картинки в такой див?

Этим самым хочу сделать всем дивам одинаковый размер, и избавиться от танцев, а также хочу на диве писать текст (как сделать на скрине)
Как хотя бы гуглить такой подход, прошу подсказать, потому что от фронта очень далек. Спасибо!

Comments

[Rustam Bainazarov]

Как же меня прёт от лица этого кролика.

Лицо фарцовщика времён СССР, который ошивается в гостинице «Космос».

[Ankhena]

Тег для оборачивания картинки: figure
Тег для подписи: figcaption. Это если именно подпись к картинке, а не наоборот, картинка просто украшение текста. Если второе, то span или div.

Всем figure одинаковый размер.
Картинкам либо width 100% либо родителю флекс и картинку по центру.
Подпись абсолютом.

Answer 1

[ReActor Дмитрий Вершанский]

задайте вашему div фиксированные размеры, и всем img width: 100%