title: How to prevent padded child element to overflow its parent?
body: <p>As you can see from <a href="http://jsfiddle.net/jWs8c/1/" rel="nofollow noreferrer">this example</a>, the <code>input</code> seems to "overflow" its parent <code>div</code>. I'd like to add padding to the <code>input</code> without making it overflow its parent.</p>
  
  <p>I would like to know the best solution/workaround for every browser (including IE, Firefox, Chrome, etc).</p>