title: How to Enforce Width on Element with Border?
body: <p>I'm using <a href="http://twitter.github.com/bootstrap/" rel="nofollow">Twitter Bootstrap</a> for my page layout and I want to insert a <a href="http://www.webdesignshock.com/css3-box-shadow/" rel="nofollow">CSS3 Box Shadow</a> in a column.</p>
  
  <p>The only problem I'm having is that the box shadow has a 1px border, and this is enough to cause my second column to wrap to the next line. If I remove the border it aligns up fine.</p>
  
  <p>If I subtract 2px from the column width, it looks exactly how I want. However, I'd like to take advantage of Bootstrap's fluid layout (which is based on percent rather than pixels), so there's no easy way to simply make the <code>&lt;div&gt;</code> 2 pixels narrower than whatever it would otherwise be.</p>
  
  <p>I really dislike the way that borders do not stay within an item's width. Does anyone see a way to have my <code>&lt;div&gt;</code> respect the current width even with borders?</p>