Horizontal lines seem to be all the rage latest.  Not just breaking text up, but they are used to break up H1 and H2 tags…well, hell, ANY HTML tags it seems…

No mind.  Here is a quick video showing a quick CSS to make that HR line look fancy (code below)!

And the CSS.

• Put this in the BEFORE Custom CSS
• Change the color in the CSS (the color of the Divider module will not do anything one this CSS is applied)

border: 0; 
height: 1px; 
background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);

Build Beautiful.

Logan Ramirez

Native Texas, Logan Seth Ramirez is a computer science graduate from Trinity University and lives in San Antonio with his wife and four children. Along with being a web hero, he authored The Groom Wore White Socks, sings and songwrites as Logan Seth, and his favorite Spanish word is cacahuates.