Как сделать такие вот полоски after, before?

Question

[Алексей Пархоменко]

Добрый день!
Мучаюсь, не могу понять как сделать такие вот элементы слева и справа.
prntscr.com/8w7xaz
Спасибо за помощь на перед;)

Answer 1

[holfza]

https://jsfiddle.net/8tgsnyoe/

Comments

[Алексей Пархоменко]

Спасибо, спасибо, муки окончены.

[Алексей Пархоменко]

Еще вопрос, можно ли с прозрачным бекграунтом сделать, но что бы при этом не было видно линии, которая через текст пройдет.

[holfza]

Алексей Пархоменко: https://jsfiddle.net/8tgsnyoe/1/ - как-то так наверное

[Алексей Пархоменко]

holfza: Спасибо. То что нужно!

Answer 2

[Денис Инешин]

Ну например: https://css-tricks.com/line-on-sides-headers/
Или: jessica-eldredge.com/2014/01/26/headings-with-lines
Или еще: stackoverflow.com/questions/18540073/trailing-line...
Или даже так: stackoverflow.com/questions/15557627/css-title-wit...

Comments

[Алексей Пархоменко]

Спасибо большое, но в простой полоске сложности нет, в квадратике на конце самая сложность. Не могу додуматься может?!