Подскажите, как сверстать такой заголовок, с двум линиями с боку, только чтоб линии при уменьшении экрана не уплывали.
<div class="header__offer-title">JUST FOR YOU ON THEMEFOREST</div>
Stack Overflow на русском — это сайт вопросов и ответов для программистов. Присоединяйтесь! Регистрация займёт не больше минуты.
Присоединиться к сообществуПодскажите, как сверстать такой заголовок, с двум линиями с боку, только чтоб линии при уменьшении экрана не уплывали.
<div class="header__offer-title">JUST FOR YOU ON THEMEFOREST</div>
Используй :before, :after
.header__offer-title {
position: relative;
overflow: hidden;
text-align:center;
}
.header__offer-title:after {
content: '';
background-color: #DCDCDC;
height: 2px;
width: 40px;
position: absolute;
top: 50%;
margin-left: 20px;
}
.header__offer-title:before {
content: '';
background-color: #DCDCDC;
height: 2px;
width: 40px;
position: absolute;
top: 50%;
margin-left: -60px;
}
<div class="header__offer-title">JUST FOR YOU ON THEMEFOREST</div>