title: right and left borders appears on top of the top border
body: <p>As you can se here: <a href="http://jsfiddle.net/vpHW5/" rel="nofollow">http://jsfiddle.net/vpHW5/</a>
  the right and left borders appears on top of the top border. How would I fix that?</p>
  
  <p>Here's the css code:</p>
  
  <pre><code>div {
      background:#e8e3dd;
      border-right:1px solid #e3ded8;
      border-left:1px solid #e3ded8;
      border-top:4px solid #172e4e;
      height:100px;
      width:100px;
  }
  </code></pre>