EN
HTML - change textarea size
0
points
In this article, we would like to show you how to change textarea size in HTML.
Quick solution:
// ONLINE-RUNNER:browser;
<textarea name="textarea" style="width:300px; height:100px;">Type something here...</textarea>
or:
// ONLINE-RUNNER:browser;
<textarea name="textarea-name" cols="30" rows="3"></textarea>
Note:
It is recommended to use
styleattribute or CSS to change thetextareasize.
1. Using style attribute
In this example, we use textarea element's style attribute to set its width and hight.
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<body>
<textarea name="textarea" style="width:300px; height:100px;">Type something here...</textarea>
</body>
</html>
2. Using cols and rows
In this example, we use cols and rows attributes to set the textarea element width and height.
cols- the number of visible characters width of thetextarea- it is average characters width (if not specified, the default value is 20),rows- the number of visible text lines.
Runnable example:
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<body>
<textarea name="textarea" cols="30" rows="5">Type something here...</textarea>
</body>
</html>
3. Using CSS
You can also change the textarea element size using CSS.
The solution is described in details in the following article: