Привет сообществу, я пытаюсь сделать что то типо книжных заголовков, то есть, должен быть заголовок по центру, а по бокам с отступом конечно небольшим, должны быть линии до конца экрана(адаптивные), так вот с этими линиями и получилась проблемка, я знаю что делать их надо с помощью before и after, но не получается сделать то что надо, заранее благодарю за помощь в решении вопроса!
Ну без before и after тут сложно было бы обойтись я бы делал так:
css – дорисовываем с помощью псевдоклассов before, after мы добавляем блок с высотой в пиксель и зарисовываем ему фон, таким образом создается такая полоса
body {
background: #ccc;
}
h1 {
display: flex;
align-items: center;
justify-content: space-between;
}
h1::before,
h1::after {
content: '';
display: block;
flex-grow: 1;
height: 1px;
background: #000;
}
h1::before {
margin-right: 40px;
}
h1::after {
margin-left: 40px;
}
Ну и наш заголовок:
Hello