title: How to align two different font-sizes next to each other?
body: <p>How do I align two different-sized fonts next to each other so that the smaller text is centered vertically with the larger text?</p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;div id="parent"&gt;
      &lt;span id="first"&gt;first&lt;/span&gt;
      &lt;span id="second"&gt;second&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS:</strong></p>
  
  <pre><code>#first {
      font-size: 200%;   
  }
  
  #second {
      font-size: 100%;
  }
  </code></pre>
  
  <p><strong>JSFiddle:</strong> <a href="http://jsfiddle.net/BmbWr/" rel="nofollow">http://jsfiddle.net/BmbWr/</a></p>