title: Double borders div should merge css
body: <p>If you look at this <a href="http://jsfiddle.net/hz2vyrqp/" rel="noreferrer">fiddle</a> you'll see that the borders won't merge.<br>
  css:</p>
  <pre><code>div{
      float:left;
      background-color:moccasin;
      width:100px;
      height:100px;
      border:1px solid tomato;
  }
  </code></pre>
  <p>The amount of divs is random, and I can only give it 1 class/id.
  <br>
  Also keep in mind that the page can be resized and the amount of divs on a row can change.</p>
  <p>I've tried <code>margin-left:1px;</code> and last-child/nth-child() selectors but they don't work when you resize the screen or it still gives unwanted border.</p>
  <p><strong>edit:</strong> I can NOT move the divs for a single pixel, when I give the divs <code>margin-left:-1px;</code> and give the first div <code>margin-left:1px;</code> I'll get unwanted results in the next rows.</p>