How to make textarea to fill div block?

Question

Check out how far have I got it here: [link was removed] How can I make the textarea above the green button to fill the div block? I mean, how to make the textarea exactly the same width as the comment block?

Answer 1

Please refer to this article which implements the CSS3 box-sizing property http://css-tricks.com/box-sizing/

A quick solution for this is to set

textarea {      width: 100%;      -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */      -moz-box-sizing: border-box;    /* Firefox, other Gecko */      box-sizing: border-box;         /* Opera/IE 8+ */ } 

And here is a working example which implements the box-sizing property http://css-tricks.com/examples/BoxSizing/

Using widths like 99% or somewhat lesser to adjust within the container div, has already been discouraged.

Answer 2

Dimensioning textareas in percents has somehow never worked properly, I had the same problem years ago and ended up using width: 99%....

I suggest you use a div around the textarea to draw the rounded border and remove the border on the textarea itself. This way the width of the textarea doesn't need to be exact, you could use 98% or 99%.