Horizontal Line with Text in the Middle

[ManBearPig]

Can’t figure out how to put a horizontal line with text in the middle.

The only way so far is to use one row with three columns, but as soon as you switch to a small screen, lines are placed top and bottom.

See image below of what I’m trying to achieve.

Thanks in advance for any advice.

[malachiman]

You could do this with spans, or even pseudo elements before and after. Just make sure you wrap the whole lot in a div.

Here is one of many ways to do it, download project here and obviously modify to suit your use case.