title: Ghost space between inline-block elements in Chrome, Safari and Firefox
body: <p>How can I remove the ghost space between inline-block elements?</p>
  
  <p>Here is a jsfiddle <a href="http://jsfiddle.net/hFDcV/" rel="nofollow">http://jsfiddle.net/hFDcV/</a> where you can clearly see a horizontal space between the divs.</p>
  
  <p>And the StackOverflow mandated example code:</p>
  
  <pre><code>&lt;div id='row'&gt;
    &lt;div class='box'&gt;Something&lt;/div&gt;
    &lt;div class='box'&gt;Something&lt;/div&gt;
    &lt;div class='box'&gt;Something&lt;/div&gt;
    &lt;div class='box'&gt;Something&lt;/div&gt;
  &lt;/div&gt;
  
  #row {
    background-color: red;
  }
  
  .box {
    width: 150px;
    height: 150px;
    background-color: yellow;
    display: inline-block;
    margin: 0;
    padding:0;
  }
  </code></pre>
  
  <p>​</p>