Question

For goodness sake!! Why is my input box being cut off on the right? I’ve looked into the padding and margins in chrome and I cant see whats causing it. I am new to this, but it remains a mystery.

http://jsfiddle.net/GCt3z/1/

Answer 1

Because it’s 100% + 10px (padding) + 2px (border) wide. Try using:

-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
        box-sizing: border-box;

See the updated Fiddle > http://jsfiddle.net/GCt3z/2/