title: How to avoid whitespace anchor underline w/o changing coding style?
body: <p>Take a look at the following fiddle:</p>
  
  <p><a href="http://jsfiddle.net/DNhAk/14/" rel="noreferrer">http://jsfiddle.net/DNhAk/14/</a></p>
  
  <p>When you have an image with text wrapped in an anchor/link, the whitespace between the image and the text in the code creates a underlined whitespace in the rendered page right before the text.</p>
  
  <p>When there is no image, there is no underlined whitespace even though there is whitespace in the code.</p>
  
  <p>The only way I can see the avoid this underlined whitespace is to eliminate the whitespace in my code. But I hate altering my coding style in order to alter the presentation of the rendered page. Anyways, altering your HTML in order to manipulate the presentation of a page is wrong anyways. It's like using line breaks (<code>&lt;br/&gt;</code>) to add space between elements instead of using CSS.</p>
  
  <p>Is there a not-so-obvious-to-me CSS property that is used to fix this issue?</p>
  
  <p><strong>UPDATE</strong>
  For some reason people are getting hung up on the image borders and margin that I had in the code. I only put them in there to make it look nice. They have nothing to do with the problem, so I removed them and updated the fiddle just so people can understand more clearly what the problem is.</p>