title: Turn link into image "button"
body: <p>I would like to remove the text in a link and replace it with an image using css.</p>
  
  <p>Markup:</p>
  
  <pre><code>&lt;a id="notifications" href="#"&gt;Notifications&lt;/a&gt;
  </code></pre>
  
  <p>Css:</p>
  
  <pre><code>#notifications{
      background: url('http://icons.iconarchive.com/icons/treetog/i/16/Floppy-Small-icon.png') no-repeat;
      height: 16px;
      width: 16px;
      text-indent: -9999px;
      overflow: hidden;
    }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/MsG6A/" rel="nofollow">JsFiddle</a>.</p>
  
  <p>I have tried all sorts of things, but can't seem to get rid of the text. Is this something that is not doable with css?</p>