Material Angular Accordion header/title height

Question

So I\'ve been trying to adopt Materials Accordion in my Web Application development.

However having some troubles getting the header to expand in size as the content gro

Answer 1

As of today with Material 7.0.2, If you want to have the header follow some generic height:auto rule, this fix height might not be your solution. (for instance to follow the size of the text in the header in responsive situations)

in these situations, it's much better to have an auto height defined in css:

  mat-expansion-panel {
    mat-expansion-panel-header {
      height: auto!important; 
    }
  }

and define

as explained in https://github.com/angular/material2/pull/9313