title: CSS transparent background image using "data:"
body: <p>I've seen on some sites that you can include images in CSS using a "data" keyword:</p>
  
  <pre><code>.stuff {
    background: transparent url(data:image/gif;base64,SOMEWEIRDCODEHERE) repeat center top;
  }
  </code></pre>
  
  <p>the weird code looks like a base64 ecoded string like:</p>
  
  <blockquote>
    <p>R0lGODlhMwAxAIAAAAAAAP///
    yH5BAAAAAAALAAAAAAzADEAAAK8jI+pBr0PowytzotTtbm/DTqQ6C3hGX
    ElcraA9jIr66ozVpM3nseUvYP1UEHF0FUUHkNJxhLZfEJNvol06tzwrgd
    LbXsFZYmSMPnHLB+zNJFbq15+SOf50+6rG7lKOjwV1ibGdhHYRVYVJ9Wn
    k2HWtLdIWMSH9lfyODZoZTb4xdnpxQSEF9oyOWIqp6gaI9pI1Qo7BijbF
    ZkoaAtEeiiLeKn72xM7vMZofJy8zJys2UxsCT3kO229LH1tXAAAOw==</p>
  </blockquote>
  
  <p>look pretty cool :D</p>
  
  <p>I was wondering how can I include a transparent 1x1 pixel GIF like this? Does anyone know the data code for such a image?</p>
  
  <p>Is it a good idea to do this for small and very common images? Do all browsers support this?</p>