search

angular-material-extensions / select-country

Angular Material component that allow users to select a country or nationality with an autocomplete feature
https://angular-material-extensions.github.io/select-country/
MIT License
126 stars 40 forks source link

How to increase Width #79

Open waelbenmustapha opened 3 years ago

waelbenmustapha commented 3 years ago

Hi , im new to angular and im really not sure if this could be achieved from angular material or if you can add a feature wich allows width modification . i tried everything but couldn't increase the width ,

RHeynsZa commented 3 years ago 
mat-form-field {
  width: 100%;
}

Add that to your styles.scss

Note it influences every mat form field in your app. Idk if its the right way, but I couldn't find a way to to it otherwise

simionrobert commented 3 years ago

Try adding this to the component in cause.

::ng-deep mat-form-field {
  width: 100%;
}

Note: Didn't work with RHeynZa solution but it worked with this one for me.

felixmoroni commented 2 years ago

Add this to your global css file

mat-select-country .mat-form-field {
  width: 100%;
}

It will only apply to mat-form-field nested in mat-select-country.