About flex Layout on mat-expansion-panel from angular

144 Views Asked by At

how can I use flex layout in component mat-expansion-panel so that it is the size of the mobile screen?

The component: component pic

how is it shown on mobile view:mobile view

you can see the component has been cut in half.

The code:

<ngc-card class="card-custom" fxLayout.xs="column" > 
  <div *ngFor="let inscricao of inscricoes; let p=index" class="container" style="display: flex">
    <mat-expansion-panel hideToggle class="container2" > 
      <mat-expansion-panel-header>
        <button (click)="expandedElement = expandedElement === element ? null : element">
          <mat-icon  >
            {{ expandedElement !== element ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}
          </mat-icon>
        </button>
        <mat-panel-title style="font-size:15px">

....
0

There are 0 best solutions below