Max-content и text-align не работают вместе?

Question

[art style]

есть список ul li
хочу сделать у каждого li нижний бордер по размеру текста по центру
по отдельности width:max-content и text-align:center работают, но вместе нет
можно сделать через Margin-left:auto margin-right:auto но правильно ли так?

Comments

[historydev]

Поточнее.

[poniyur]

можно сделать через Margin-left:auto margin-right:auto но правильно ли так

Если можно и работает, то правильно

[Ankhena]

Как это сверстать?
Либо просто обернуть в спан

Но к вопросу нет ни кода ни макета, остается только гадать.

Answer 1

[Арсений Матыцин]

Бордер идет вместе с элементом неразрывно, если хочешь сделать, то используй псевдоэлементы и позиционирование. Или оборачивай содержимое в span и ему задавай условия для границ.

В любом случае ни к чему хорошему это не приведет. К тому же в случае спана, тебе скорее всего придется задавать ему display:inline-block, чтобы спозиционировать отступами.

Comments

[Антон Шаманов]

чисто технически можно извратится с border-radius, но идея заведомо говно