Simon
Simon

Reputation: 1476

Mat-select is opening in full screen

We are working on an Angular 13 application and are currently implementing a material form. From the examples are we implementing :-

<mat-form-field>
        <mat-label>State</mat-label>
        <mat-select>
            <mat-option>New York</mat-option>
            <mat-option>Washington</mat-option>
            <mat-option>Florida</mat-option>
        </mat-select>
    </mat-form-field>

enter image description here

which renders correctly

However, on clicking the dropdown, the options are stretching full screen, and is impossible to see the items. We cant seen any custom CSS that would effect this, and now struggling to see what the issue could be..

enter image description here

Upvotes: 1

Views: 440

Answers (1)

MADMVX
MADMVX

Reputation: 379

A little bit late but i solved it, you have to set the themes of your application. In my case i set a custom theme in src/assets/styles/mytheme.scss.

But you can use the default themes and it should work.

Upvotes: 1

Related Questions