title: Add image to link with CSS
body: <p>I have some URLs to which I want to add the same image. I've got the following code:</p>
  
  <pre><code>a.linkArrow
  { 
      background: transparent url('../images/abc.png') no-repeat center right;
      padding-right: 60px;
  }
  </code></pre>
  
  <p>And a link example:</p>
  
  <pre><code>&lt;a class="inkArrow" href="#abc"&gt;Abc?&lt;/a&gt;
  </code></pre>
  
  <p>The problem is, the image appears on the left of the text of the link. I want that the image appears always on the right side of the text AND that the distance from the start position of the link text to the start position of the image is always the same. So when I have multiple links in a row that the images of the links align. The image should be clickable and lead to the same url as the link (I'm not sure if it is possible to enclose it in the same  tag for this approach.</p>
  
  <p>Any ideas?</p>