title: Why can't I decrease the line-height of this text?
body: <p><a href="http://jsfiddle.net/mJxn4/" rel="noreferrer">http://jsfiddle.net/mJxn4/</a></p>
  
  <p>This is very odd: I have a few lines of text wrapped in an <code>&lt;em&gt;</code> tag. No matter what I do, lowering the value for <code>line-height</code> below 17px has no effect. I can bump the <code>line-height</code> <em>up</em> to greater than 17px and it'll apply, but I can't get it lower than 17px.</p>
  
  <p>The CSS in question is:</p>
  
  <pre class="lang-css prettyprint-override"><code>#others .item em {
      font-size: 13px;
      line-height: 17px;
  }
  </code></pre>
  
  <p>Try adjusting the line height both higher and lower and run the updated fiddle after each change, and you'll see what I mean.</p>
  
  <p>Why would this be? No <code>line-height</code> is specified anywhere else in the CSS, so nothing is overriding it. That couldn't be the case anyway because I'm adjusting the <code>line-height</code> up and down <em>within the same selector</em>, so it doesn't make sense that a higher value would apply, but a lower value would get overridden.</p>