Как сделать перенос текста на другую строку в псевдоэлементе?

Question

[barsecky]

Всем привет!
Может и глупый вопрос, но все же...
Нужно через псевдоэлемент поставить текст, при чем текст толжен быть в 2 строки .
Как сделать перенос на другую строчку части текста?
Нужно что бы SMM было на одной строке , Web Focus на другой строке.
P.S. что то мне подсказывает что ответ на поверхности , и я уже просто туплю(((
P.P.S. br пробывал не получается((((

.after__babble-img::before {
    position: absolute;
    display: block;
    content: "SMM Web Focus";
    font-weight: 800;
    font-size: 47px;
    line-height: 1.30;
    text-align: center;
    color: #FFFFFF;
    max-width: 250px;
    height: 100px;
    left: 85px;
    z-index: 5;
    transform: translateY(48%);
}

Comments

[Rustam Bainazarov]

Только ограничением ширины контейнера можно заставить текст переносится в псевдоэлементах. В вашем же случае, судя по всему, придётся делать либо без них, либо с помощью двух псевдоэлементов с разными строчками, и уже их совмещая на absolute.

[barsecky]

думал об этом, но уж слишком геморно.
проще текст картинкой из макета вытащить... думал может есть какие другие варианты

Answer 1

[Ankhena]

Для вставки спецсимволов в content надо использовать escaped unicode. Например,
\0a — перенос строки
\a0 — неразрывный пробел
\20 — пробел

Comments

[barsecky]

Что то не работает(((

[Ankhena]

barsecky, вы же видите мою работающую песочницу. Показывайте, что вы пишете и что у вас не работает.

Вероятно, забыли white-space

[Rustam Bainazarov]

Вот я и забыл, что есть символ переноса строки.

[Ankhena]

Рустам Байназаров, сложно всё удержать в голове, что-то бывает вываливается.
Особенно смешно бывает, когда начинаю гуглить и нахожу свой же ответ на Тостере )))

[Максим]

Ankhena, жесть ...:))

[barsecky]

Ankhena, Вы правы, видемо просто от усталости , действительно не добавил white-space .
Благодарю за ответ, все получилось.