Здраствуйте, у меня возникла такая проблема.
Есть картинка в которой нужно сделать обтекание по левому краю, при этом под картинкой должна быть подпись( как должно быть видно в приклеплённой фотографии).
Я знаю как это сделать используя два элемента div, а можно ли это сделать с одним таким элементом, чтобы не писать лишний код
1 ответ
Такие подписи (не только к картинкам) правильно делать при помощи элемента <figure>
. Выглядеть это будет так:
<figure>
<img src="" alt="">
<figcaption>Some text</figcaption>
</figure>
Чтобы текст обтекал картинку, используйте для неё свойство float
. Но учтите, что если высота текста будет меньше высоты обтекаемой картинки, то она будет некрасиво вылазить за границы контейнера (фиксится clearfix'ом). Пример:
.float-right: {
float: right;
}