Как обвести текст по контуру при переносе на две строки?

Question

[Lara B]

При ресайзе экрана текст переносится на вторую строку, но рамка у тега идет на всю ширину строки. Есть ли способ проверсти рамку именно по периметру текста?

Comments

[Виктор]

Есть ли способ

есть

сейчас как сделано? в песочницу можно?

[Lara B]

Виктор, есть ссылка на сайт https://xn--b1aed8agecja.xn--h1ahn.xn--p1acf/zenec... , если через инспектор не удобно - оформлю на codepen
Буду очень благодарна, потому что даже не ожидала, что не смогу сходу сделать

[Ivan Ustûžanin]

при переносе текст — нормально никак, браузеры не уменьшают ширину блока после того, как он расширился на максимум из-за переполнения

Answer 1

[Виктор]

На мой взгляд, проще и красивее сделать на всю ширину

Но если нужно получить ожидаемое, то вариант - явно разделить строки (например, в инспекторе я нажал shift+enter) и указать для ссылок white-space: pre-line. Соответственно, white-space можно менять в медиа запросе.

<a href="#">Детское игровое и спортивное
оборудование</a>

.goods-cat__labels > a {
    white-space: pre-line;
}

Comments

[Lara B]

Супер! Спасибо!