title: Adding gaps in between sprite image
body: <p>I have this image: <a href="http://fs5.directupload.net/images/160602/xfrddbfa.png" rel="nofollow">http://fs5.directupload.net/images/160602/xfrddbfa.png</a> </p>
  
  <p>and I would like to add it into my website. But, I'd also like to add a small gap in between each and every flag.</p>
  
  <p>Is that somehow possible? Here is the HTML where I'd like to place it as a pseudo element before the class "headline":</p>
  
  <pre><code>&lt;div class="bottom_dual"&gt;
      &lt;a title="title" href="#"&gt;
          &lt;span class="headline"&gt;Lorem ipsum&lt;/span&gt;
      &lt;/a&gt;
      &lt;span class="caption"&gt;Lorem ipsum.&lt;/span&gt;
      &lt;span class="more"&gt;
          &lt;a class="teaser_link" href="#"&gt;more&lt;/a&gt;
      &lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Thanks for your help!</p>