css - How to customize ion text area in ionic?

Question

I would like ask for some assistance regarding on how to use ion-textarea. I am new in Ionic and experiencing a lot of new things in using this. Please refer to the image below on how I will fix this issue. Instead of showing scrollbar in the right side. The text was shown outside the text area. Hope you can help me. Thank you

Here's my code I used:

<ion-col size-md = "12">
    <ion-textarea class = "italic" rows="10" cols="5" maxlength = "200" placeholder="Please provide additional comments here..."  [(ngModel)]="postFeedback.explanation"></ion-textarea>
 </ion-col>

question from:https://stackoverflow.com/questions/65917457/how-to-customize-ion-text-area-in-ionic

Answer 1

Please refer to Ionic documentation for this or any future questions regarding the natural behavior of ionic. To answer your question: try using autoGrow = "true" as follows :

<ion-col size-md = "12">
    <ion-textarea class = "italic" rows="10" cols="5" autoGrow="true" maxlength = "200" placeholder="Please provide additional comments here..."  [(ngModel)]="postFeedback.explanation"></ion-textarea>
 </ion-col>