Как разместить текст над изображением?

Question

[miron44444ik]

https://jsfiddle.net/artmir/09dvg3s1/3/
Вот мой код. Как сделать чтобы текст был чуть выше и не залезал в область выделенную красным прямоугольником (см. скрин), то есть находился чуть выше, но при этом высота .slider должна быть 100vh и текст должен быть внутри изображения.

Comments

[Антон Литвиненко]

Уменьшить шрифт

Answer 1

[karmyskove]

Для .slider следует добавить вот эти свойства:

display: flex;
justify-content: center;

Изображение по центру встанет.
Чтобы текст был как на изображении, нужно классу title задать свойство: max-width: 550px;
Вот ссылка codepen: https://codepen.io/EugeneKarmyshkov/pen/wvdqPez