CSS width 100% within margins for textarea

Question

I want a <textarea> to have 100% height and width taking any margin/padding into account.

Here is a fiddle and as you can see, the <textarea> seems to include the margins.

Answer 1

add this in textarea css : box-sizing: border-box;

Answer 2

I would propose using this code on top of your css file:

/* apply a natural box layout model to all elements */
*, *:before, *:after {
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

It should make using css sizing a lot more comfortable for your. See this edited jsfiddle to get an idea of how it works.

For further reference and information read this article.