Create a gist now

Instantly share code, notes, and snippets.

Embed
FireFox Friendly Faded Gradient Border 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 */
}
<a href="#">link goes here</a>
<span class="divider"></span>
@nrrrdcore

This comment has been minimized.

Show comment
Hide comment
Owner

nrrrdcore commented Aug 29, 2012

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment