title: Make relatively positioned element not affect layout/height
body: <p>I've got an icon, like this:</p>
  
  <pre><code>&lt;div class="mydiv"&gt;
     &lt;i style="position: relative; top: 3px;"&gt;&lt;/i&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I want to move the icon down by 3 pixels, which works. But the div still has a greater height to it because the icon is technically expanding the height of the line. How do I make the icon not affect the layout at all, and not make the div bigger in height?</p>