Capture multi-line text input from users. Ideal for comments, descriptions, and feedback.
<flux:textarea />
Display a hint inside the textarea to guide users on what to enter.
<flux:textarea label="Order notes" placeholder="No lettuce, tomato, or onion..."/>
Customize the height of the textarea by passing a rows prop.
<flux:textarea rows="2" label="Note" />
Using CSS's new field-sizing property, the textarea will automatically adjust its height to fit the content by passing in the rows="auto" prop.
This feature is not available in all web browsers. Visit caniuse.com to see which browsers support this feature.
<flux:textarea rows="auto" />
If you want to restrict the user from resizing the textarea, you can use the resize="none" prop.
<flux:textarea resize="vertical" /><flux:textarea resize="none" /><flux:textarea resize="horizontal" /><flux:textarea resize="both" />