Как разместить надпись поверх картинки?

Question

[dsntmttr]

Как разместить надпись поверх картинки?

Answer 1

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

С помощью абсолютного позиционирования.

Comments

[dsntmttr]

задал абсолютное позиционирование тексту, но он появляется сбоку

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

dsntmttr, отлично, так держать. Осталось только разобраться, относительно чего работает абсолютное позиционирование и как эту точку задавать.

Спойлер: сейчас работает относительно всего документа.

[Ankhena]

Арсений Матыцин, ему даже пример делали Как добавить надпись поверх картинки?

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

Ankhena, угу. Ну чтош...

[dsntmttr]

Арсений Матыцин, текст добавлен внутрь блока, position: absolute; не пойму почему текст позиционируется относительно всего документа, если

Абсолютно позиционируемый элемент — это элемент, чьё вычисленное значение position является absolute или fixed. top, right, bottom и left задают смещения от краёв содержащего блок элемента.

[dsntmttr]

Ankhena, там работает, здесь нет

[Ankhena]

dsntmttr, ну так где relative у того, относительно кого позиционируете?

Answer 2

[Kirill Makarov]

Создаешь див ему позицию relative
Внутри него создаешь картинку и текст с позициями absolute и уже с помощью left top right bottom прзиционируешь

Либо картинку можно создавать как фон, тогда нужно после нее отступить следующему блоку, и с бэка грузить фотки чтобы придется извращаться