inline icons

by web5me

HTML

This is <a href="#" class="external">a hyperlink that <br>
goes places <span>(external)</span></a>, yet remains here.

CSS

.external span {
    display: inline-block;
    width: 11px;
    height: 8px;
    background: url(http://web5.me/images/sprite.png) left 101px;
    color: transparent;
    font-size: 8px;
    vertical-align: .05em;
    overflow: hidden;
}