![Horizontal Lines Before and After Texts (CSS Tutorial) Horizontal Lines Before and After Texts (CSS Tutorial)](https://22bulbjungle-153fe.kxcdn.com/wp-content/uploads/2019/05/Horizontal-Lines-Before-and-After-Texts-CSS-Tutorial.jpg)
This Video is going to show you CSS Tricks: Horizontal Lines Before and After Texts (Quick Tutorial) Horizontal Line After Text.
Code
<h1>We are Awesome</h1>
h1{ font-family: sans-serif; margin: 100px auto; text-align: center; font-size: 40px; max-width: 600px; position:relative; } h1:before{ content: ""; display:block; width: 120px; height:2px; background: #000; position: absolute; left: 0; top: 50%; z-index: -2; } h1:after{ content: ""; display:block; width: 120px; height:2px; background: #000; position: absolute; right: 0; top: 50%; z-index: -2; } span{ background: #fff }