title: CSS: Overlapping borders
body: <p>I just stumbled on a problem where the shared border between a menu bar and the main content box does not go on properly (as the content box is too small)</p>
  
  <p>Image: <a href="http://imgur.com/O3ra9" rel="noreferrer">http://imgur.com/O3ra9</a></p>
  
  <p>Code: <a href="http://jsfiddle.net/gh55e/2/" rel="noreferrer">http://jsfiddle.net/gh55e/2/</a></p>
  
  <p>So I was wondering if there was a way to fix the border. Maybe by giving them both one and making it overlap? Just have no idea how to do this as margin -x doesn't work. </p>