title: placing fixed images side by side
body: <p>I want to have fixed social media icons in the top right corner of my page. I've got working css code that accomplishes this, but I'm wondering if there is a more efficient way since it seems repetitive. I'd also like to hear any compatibility issues you notice.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>    img.body {
        display: block;
        margin-left: auto;
        margin-right: auto;
      }
      img.tile1 {
        position: fixed; 
        top: 0px; 
        right: 0px; 
        width: 48px;
        height: 48px;
      }
      img.tile2 {
        position: fixed; 
        top: 0px; 
        right: 48px; 
        width: 48px;
        height: 48px;
      }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>  &lt;a href="instagram.com/handle"&gt;&lt;img src="graphics/ig.png" class="tile1"&gt;&lt;/a&gt;
    &lt;a href="facebook.com/handle"&gt;&lt;img src="graphics/fb.png" class="tile2"&gt;&lt;/a&gt;</code></pre>
  </div>
  </div>
  </p>