title: Bold text line-height is higher than normal text line-height
body: <p>Must be something basic I'm missing here. I thought that font-weight:bold should not change how much vertical space the text takes. Especially when the line-height is set to be higher than the font-size.</p>
  
  <p><a href="http://jsfiddle.net/Arkkimaagi/7xAyy/" rel="noreferrer">http://jsfiddle.net/Arkkimaagi/7xAyy/</a></p>
  
  <p>On my OSX chrome those three text heights do not match. The second one with font-weight:bold is 1px higher than the rest. The third div is just an example of fixing the problem (poorly)</p>
  
  <p>I'm trying to set the line-height to something specific (18px) here, to have "vertical rhythm"</p>
  
  <p>My question is, how can I have bold and normal text both with same line-height as in the example? </p>
  
  <p>[edit:] 
  here's what I see on my mac
  <img src="https://i.stack.imgur.com/HgR5j.png" alt="Example of the problem on my osx"></p>
  
  <p>Also, here is what I ment by "vertical rhythm": <a href="http://www.alistapart.com/articles/settingtypeontheweb" rel="noreferrer">http://www.alistapart.com/articles/settingtypeontheweb</a>
   - the baseline grid is more visible in the example: <a href="http://www.alistapart.com/d/settingtypeontheweb/example_grid.html" rel="noreferrer">http://www.alistapart.com/d/settingtypeontheweb/example_grid.html</a></p>