Should I size a textarea with CSS width / height or HTML cols / rows attributes?

According to the w3c, cols and rows are both required attributes for textareas. Rows and Cols are the number of characters that are going to fit in the textarea rather than pixels or some other potentially arbitrary value. Go with the rows/cols.


I recommend to use both. Rows and cols are required and useful if the client does not support CSS. But as a designer I overwrite them to get exactly the size I wish.

The recommended way to do it is via an external stylesheet e.g.

textarea {
  width: 300px;
  height: 150px;
}
<textarea> </textarea>

textarea { height: auto; }
<textarea rows="10"></textarea>

This will trigger the browser to set the height of the textarea EXACTLY to the amount of rows plus the paddings around it. Setting the CSS height to an exact amount of pixels leaves arbitrary whitespaces.

Tags:

Html

Css

Textarea