FireFox Friendly Faded Gradient Border CSS

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 */
}

divider.html

<a href="#">link goes here</a>
<span class="divider"></span>