@Please2334

Span разбивает текст на две части. Возможно ли это исправить.?

Span разбивает текст на две части. Нужно чтоб он шел одним единым тестом. Как это можно справить?
6499456dd7cda587192856.png
HTML
<div class="header__bottom">
                    <img class="header__bottom-img" src="images/krest.svg" alt="">
                    <div class="header__bottom-box">
                        <p class="header__bottom-text header__bottom-text--one"><span>Мы открыты и принимаем заказы до
                                21:00</span>, позвоните сейчас и мы сделаем скидку 15%</p>
                        <p class="header__bottom-text header__bottom-text--two"><span><a href="#">Получить
                                    скидку</a></span>
                        </p>
                    </div>
                </div>

CSS
.header__bottom {

    display: flex;
    justify-content: space-between;
    position: absolute;
    left: 0;
    bottom: 25px;
    max-width: 1170px;
    width: 100%;
    background-color: #000;
    border-radius: 5px;
    padding: 15px 0px;

}

.header__bottom-img {
    padding-left: 30px;
    cursor: pointer;
}

.header__bottom-box{
    display: flex;
    justify-content: space-between;

}
  • Вопрос задан
  • 257 просмотров
Пригласить эксперта
Ответы на вопрос 1
@venomprog
Тебе здесь для чего флекс?
спан - строка
у тебя он и не должен биться на 2 блока, убери здесь флекс
Мы открыты и принимаем заказы до
21:00, позвоните сейчас и мы сделаем скидку 15%

Когда прописываешь флекс - его элементами внутри автоматически устанавливается display: block
поэтому тебя и делится на 2 блока текст, который должен идти в одну строку.

(Решение: убери класс, который вешает флекс на этот )
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы