title: Is it OK to have an empty anchor tag?
body: <p>I know that I can do the following if I want to turn an image into a click-able link:</p>
  
  <pre><code>&lt;a href="http://twitter.com/username"&gt;&lt;img src="icons/twitter.png" /&gt;&lt;/a&gt;
  </code></pre>
  
  <p>But I would prefer to use a CSS background image so that I can have a hover state:</p>
  
  <pre><code>&lt;a class="twitter" href="http://twitter.com/username"&gt;&lt;/a&gt;
  
  # css
  .twitter{display:block; width:16px; height:16px; background:url("twitter.png")}
  </code></pre>
  
  <p>This works fine except I'm not sure it's entirely valid to have an anchor link that contains nothing. Chrome renders it fine, as does FF, but I'm not sure if others are the same.</p>
  
  <p>I realise I could just put some text inside the link, and hide it with <code>text-indent: -9999px</code>, but I've never liked that approach, for <a href="http://luigimontanez.com/2010/stop-using-text-indent-css-trick/" rel="noreferrer">various</a> <a href="http://maileohye.com/html-text-indent-not-messing-up-your-rankings/" rel="noreferrer">reasons</a>. Is my code above cross-browser compatible?</p>