Как сделать, чтобы h4 отображался поверх hr или div?

Question

[Иван Желудков]

Ссылка на Codepen
Мне нужно сверстать вот такой заголовок, с чертой до конца блока с каждого края. И вот как бы я не пытался сделать эту черту за заголовком, чтобы фон заголовка её перекрыл, у меня ничего не выходит.

Пробовал z-index. Работает, только если задать отрицательное значение, но тогда черта уходит вообще за всю вёрстку. А всю вёрстку подгонять под это не хочется.
Пробовал hr заменять на div, толку не было, ведёт себя точно так же.
Помогите.

Comments

[Иван Желудков]

Всем спасибо. Подсказали простое решение с помощью border.

Answer 1

[Андрей Б.]

codepen.io/anon/pen/epvdLZ

Answer 2

[Ivanq]

jsfiddle.net/Ivanq/8rqchvx8