Как сохранить выравнивание объекта по центру текста ⇐ CSS

[Anonymous]

Есть ли способ убедиться, что полоса выделения над заголовком всегда остается на одной линии с началом первого слова? Это работает, когда текст в заголовке выровнен по левому краю, но в этом случае текст должен быть выровнен по центру дизайна. Когда экран сжимается, текст смещается, а полоса остается на месте, она всегда должна следовать за текстом.
Одно из моих требований — обеспечить отзывчивость.


Я пробовал привязать полосу к первому слову, но в большинстве случаев это приводит к тому, что заголовок не отображается. чтобы отображать правильно и не реагировать должным образом, я попытался расположить его относительно/абсолютно и переместить влево на процент, но в основном он остается на месте, а когда текст сдвигается, полоса не меняется.Обратите внимание на это проект использует React, MUI.
Разметка для воссоздания:




{dividertype === 'Image' ? (

) : (

)}







{

}





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