How to use CSS In HTML
As mentioned earlier, the simplest way to disable the resize grabber is by using CSS. The resize property allows us to control the resizable behavior of <textarea>. By setting this property to none, we can disable the resize grabber. This approach is recommended as it is easy to implement and does not require any additional JavaScript code.
Syntax:
<textarea rows="4" cols="50">w3wiki</textarea>
By default, this <textarea> element includes a resize grabber.
Example: In this example, we will see how to disable the resize grabber of textarea in an HTML document by using CSS .
HTML
<!DOCTYPE html><html><head> <title>Page Title</title></head><body> <textarea rows="4" cols="50"> w3wiki </textarea></body></html> |
Output:
Resizing Icon is present.
To disable the resize grabber, we can add the following CSS code to the <style> section of our HTML document:
HTML
<!DOCTYPE html><html><style> textarea { resize: none; }</style><head> <title></title></head><body> <textarea rows="4" cols="50"> w3wiki </textarea></body></html> |
Output:
No Resizing Icon.
How to disable the resize grabber of in HTML ?</h1></div>
You can use the resize property to specify whether a text area should be resizable or not. The <textarea> is an HTML tag used to create a multi-line input field. By default, <textarea> includes a resize grabber in the bottom right corner which allows users to resize the input field by dragging the grabber with the mouse.