I want to set the height of a lightning:textarea field, Here is what I found in the Lightning Component Developing guide -

The rows and cols HTML attributes are not supported. To apply a custom height and width for the text area, use the class attribute. But I can't get it to work, can anyone help me with this please?


  • 1
    what have you tried? please include your code, it will be easier for community members to assist you. thanks
    – glls
    Commented Feb 1, 2018 at 1:27

2 Answers 2


You'll need to add css to do this.

If you would like to set the same custom height on all lightning:textarea in your component, you can add:

.THIS textarea {
  height: 5rem;

If you want to add height to specific lightning:textarea, you should make a custom css class and put it on the lightning:textarea you would like to modify. Here's an example of that:

.THIS .tallTextArea textarea {
  height: 5rem;

<lightning:textarea label="Default Height Text Area" />
<lightning:textarea label="Tall Text Area" class="tallTextArea" />

Try this:


<lightning-textarea class="textAreaBody"></lightning-textarea>


.textAreaBody {

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .