title: CSS: display:inline-block invisible padding
body: <p><a href="http://jsfiddle.net/QYtnL/" rel="nofollow">http://jsfiddle.net/QYtnL/</a></p>
  
  <pre><code>&lt;div id="wr"&gt;
      &lt;div&gt;&lt;/div&gt;
      &lt;div&gt;&lt;/div&gt;
      &lt;div&gt;&lt;/div&gt;
  &lt;/div&gt;
  
  #wr {
      background:red;
      text-align:center;
  }
  #wr &gt; div {
      display:inline-block;
      background:black;
      font-size:0px;
      line-height:0px;
      margin:0px;
      padding:0px;
  }
  </code></pre>
  
  <p>How to remove that annoying padding, to make all divs 0px height?
  If i'm removing <code>display:inline-block;</code> , it's gone, but i need <code>inline-block</code>.</p>