Как добавить пробел между двумя текстами в компоненте значка Mantine? ⇐ CSS

[Anonymous]

Я использую Mantine UI + Talwind CSS для написания компонентов.
Я пытаюсь добавить пространство между двумя текстами в компоненте Badge, чтобы один текст был выровнен по левому краю, а другой — по левому краю. другой справа. Вот мой текущий код:




Size:
L





Однако оба текста выровнены рядом друг с другом. Я хочу, чтобы «Размер:» находился в крайнем левом углу, а «L» в крайнем правом углу значка.
Мой значок
Ожидаемый результат
Я пробовал использовать
and

между текстами
Кроме того, я использовал элемент Space из Mantine Core, но он не дает достаточного заполнения.
Я использовал жестко закодированный элемент «Ширина для пространства», и это частично решает мою проблему, но не делает пространство отзывчивым, что приводит к ошибкам в пользовательском интерфейсе.
Size:

L


Подробнее здесь: https://stackoverflow.com/questions/786 ... -component