title: span spacing after font-size change
body: <p>I'm having this strange problem where an undesired space is being produced when changing the font-size of a span. </p>
  
  <p>In a row I have two pieces of text together, a link and a span. I have the link and optionally the span can appear, if both of them have the same font-size when the span appears the spacing is the same as without the span. </p>
  
  <p>If I set a lower font-size to the span the spacing becomes slightly bigger. I want to change the font-size of the span but keep the same spacing between rows as if the span wasn't there. </p>
  
  <p>Hope I was clear enough so you can help me =D</p>
  
  <p><strong>Html:</strong></p>
  
  <pre><code> &lt;table id="peda" align="center" width="100%" style="table-layout:fixed;
     word-wrap:break-word" border="0"&gt;
          &lt;tr&gt;
           &lt;td align="left"&gt;&lt;h1&gt;&lt;a class="categoria" 
                href="unrad"&gt;categoria&lt;/a&gt;&amp;nbsp;&amp;nbsp;
              &lt;span class="rad"&gt;rad&lt;/span&gt;&lt;/h1&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td align="left"&gt;&amp;nbsp;&lt;a href="res"&gt;res&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
    &lt;/table&gt;
  </code></pre>
  
  <p><strong>CSS:</strong></p>
  
  <pre><code>a.categoria:link, a.categoria:visited {
      color: #424242;
      text-decoration: none;
  }
  a.categoria:hover {
      color: #424242;
  }
  
  span.rad{
      color: #5b80b2;
      font-size:10px;
      padding:0px;
      margin:0px
  }
  </code></pre>