How to center the H1 underline on the page?

Question

css

There is a page, you need to display a h1 heading in the center on it, which should be underlined with a line of 5 pixels and red colors?
How can I make this underline line within the heading, and not the full width of the block, or a static underline width?

Thank you.

Answer 1

Margin auto for the header, it will push it to the center of the parent

Answer 2

Like this?