Как сделать обтекание текста снизу в списке html?

Question

[Bafrektez]

Доброй ночи. Суть такова - есть список из 5 изображений. Они отображается в линию. И надо под каждым изображением написать 3-5 слов, чтобы при смене разрешения верстка не плыла. Подскажите, как это лучше сделать?

Answer 1

[Павел Радьков]

Сделайте так codepen.io/paulradzkov/pen/WvgLwN?editors=110

Картинки могут быть любых размеров, текст любой длины.

Фишка в том, что каждый элемент li сделан инлайновой таблицей, а таблицы не могут сжаться больше, чем контент внутри них. Чтобы таблицы приняли ширину картинки, ставим width: 1%. Иначе таблица растягивается по ширине абзаца.

Answer 2

[Андрей Федоров]

предлагаю использовать figure и figcaption