CODEWITHSUNDEEP
htmltextareacss
onlineracoon
onlineracoon

Reputation: 2970

textarea chrome width height

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 100x100).

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

Upvotes: 0

Views: 2552

Answers (1)

Derek 朕會功夫
Derek 朕會功夫

Reputation: 94379

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/

Upvotes: 3

Related Questions