Фон для таблеток с оберщенным текстом ⇐ CSS

[Anonymous]

Как какой -то фон, я пытаюсь создать таблетку, которая будет отменена в центре изображения, и я пытаюсь избежать случая, когда фон таблетки занимает полную ширину родителя, если текст завершает. Я хочу, чтобы красная коробка была точно шириной обернутого текста.

Использование ширины: min -content на таблетке успешно удаляет дополнительный красный фон, но также вызывает обертывание содержания, чем необходимо - Первые два слова должны оставаться на одном и том же линии . span для контента также работает, но в фоновом режиме между строками есть пробел. />

Код: Выделить всё

.parent {
width: 300px;
}
.pill {
/* width: min-content; */
}
.content {
background: red;
}< /code>



first_line_part_1 first_line_part_2 this_is_a_very_long_word

Подробнее здесь: https://stackoverflow.com/questions/797 ... apped-text