Question

I use the following HTML:

<textarea></textarea>

And the following CSS:

textarea{
display: block;
margin: 0px;
padding: 0px;
border: 0px;
outline: 0px;
width: 100px;
height: 100px;
resize: none;
}

Firefox, Safari give me just what I expected a textarea of 100 x 100, but Chrome 111 x 111 (even the Chrome inspector displays 100×100).

Here is an screenshot I took: http://afbeelding.im/GF5f3d

Answer 1

Confused over padding and margin stuff? box-sizing is here!

box-sizing can make sure the element’s size is the exact same size of what you set, no matter what padding or margin, it is still the same.

box-sizing: border-box;  //This will make your life much easier.

For more: http://www.css3.info/preview/box-sizing/

Demo: http://jsfiddle.net/DerekL/ZmXKC/