When it comes to layouts, proper widths define whether or not you’ll get a headache. Especially when sizing input fields or textareas, setting the proper width is a challenge. This is due to the CSS box model, which calculates margins, paddings and borders outside of the box width.
A behavior which you can fortunately change:
box-sizing: border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box;
This changes your divs and block elements to calculate paddings and borders inside the specified width.