Tailwind CSS: How to Disable Resizing of Textarea
In Tailwind CSS, you can prevent a <textarea> from being resized by using the resize-none utility class. When the textarea is unresizable, the resizer icon will disappear as well.
Example:
<body class="bg-green-200 p-20 space-y-3">
<h1 class="text-2xl">Disable Textarea Resizing</h1>
<textarea class="resize-none px-2 py-3 w-96 h-48" placeholder="You cannot resize this textarea"></textarea>
</body>
Screenshot:

Further reading:
- Using Tailwind CSS with Font Awesome Icons: A Deep Dive
- How to Style a Pagination with Tailwind CSS
- Tailwind CSS: How to Create a Sticky Social Sharing Bar
- Text Overflow in Tailwind CSS (with Examples)
- Tailwind CSS: How to Create a Hoverable Dropdown Menu
- Tailwind CSS: Create a Responsive Top Navigation Menu
You can also check out our CSS category page for the latest tutorials and examples.
Subscribe
0 Comments