[![enter image description here][1]][1]I wanted to set max height to text area so when user keeps adding text if it reaches max height it will add a scroll. But my current implementation is that it streches the modal , so If I add more text the modal becomes too long.

How do we make it that the modal will not be streched ? Thanks.

html

 <div fxLayout="row" fxLayoutAlign="start start" class="full-width question-text" fxLayoutGap="12px">
          <mat-form-field style="height: auto; overflow: hidden;" class="pr-4" appearance="outline">
            <mat-label>Comments</mat-label>
            <div
            style="
              margin-right: 10px;
              overflow-y: auto;
              height: auto;
              max-height: 200px;
            "
          >
          <textarea cdkTextareaAutosize
          matTextareaAutosize
          matInput
          formControlName="comment"
          [required]="isCommentRequired()"
        ></textarea>
          </div>

overflow-y:scroll put that in textarea css, it's not an angular issue but a CSS one, also remove the overflow-y: auto from parent div.