Skip to content

Instantly share code, notes, and snippets.

@jdrsunshine

jdrsunshine/divider.css

Forked from nrrrdcore/divider.css
Last active August 29, 2015 14:25
Show Gist options
  • Save jdrsunshine/58279a4c70ab5c3587b5 to your computer and use it in GitHub Desktop.
Save jdrsunshine/58279a4c70ab5c3587b5 to your computer and use it in GitHub Desktop.
Download ZIP
FireFox Friendly Faded Gradient Border CSS
Raw
divider.css
.divider {
float: right; /* float this next to ur linkz */
display: block;
height: 47px; /* this */
width: 1px; /* where the magic happens */
margin: -7px 6px 0 10px; /* pulls the border to the top of the header */
background-image: -webkit-linear-gradient(top, rgba(0,93,131,.5) 50%, rgba(0,93,131,.22) 100%); /* good in safari & chrome */
background-image: -moz-linear-gradient(top, rgba(0,93,131,.5) 50%, rgba(0,93,131,.22) 100%); /* firefox friendly shit */
box-shadow: 1px 0 0 0 rgba(255,255,255,.1); /* white highlight on the inside of the border, ff now accepts this w/o a prefix */
}
Raw
divider.html
<a href="#">link goes here</a>
<span class="divider"></span>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment