mirror of
https://github.com/tabler/tabler.git
synced 2025-12-21 17:34:25 +04:00
26 lines
1016 B
Plaintext
26 lines
1016 B
Plaintext
---
|
|
title: Autosize
|
|
summary: The autosize element will automatically adjust the textarea height and make it easier for users to follow as they type.
|
|
libs: autosize
|
|
description: Auto-adjusting textarea for better usability.
|
|
---
|
|
|
|
To be able to use the autosize in your application you will need to install the autosize dependency with `npm install autosize`.
|
|
|
|
## Default markup
|
|
|
|
Add the autosize element to your input to make it automatically adjust to the length of a text as a user types it.
|
|
|
|
To create autosize textarea, add the `data-bs-toggle="autosize"` attribute to the textarea element:
|
|
|
|
```html
|
|
<textarea class="form-control" data-bs-toggle="autosize" placeholder="Type something…"></textarea>
|
|
```
|
|
|
|
Look at the example below to see how the autosize element works:
|
|
|
|
```html example centered columns={1} scrollable background="bg-light" height="20rem"
|
|
<label class="form-label">Autosize example</label>
|
|
<textarea class="form-control" data-bs-toggle="autosize" placeholder="Type something…"></textarea>
|
|
```
|