Ion-select not all options are displaying

I have an ion-select component with 11 options but only the first 5 show up in the alert. A scrollbar appears but scrolling down doesn’t reveal the other options. I can click in the empty space and an option will appear but the others disappear. This is my code:

        <ion-label floating>Please Select Cause</ion-label>
          <ion-option value="Earthquake">Earthquake</ion-option>
          <ion-option value="Explosion progress">Explosion progress</ion-option>
          <ion-option value="Water Damage">Water Damage</ion-option>
          <ion-option value="Glass Breakage">Glass Breakage</ion-option>
          <ion-option value="Malicious Mischief and Vandalism">Malicious Mischief and Vandalism</ion-option>
          <ion-option value="Riot and Civil Commotion">Riot and Civil Commotion</ion-option>
          <ion-option value="Fire">Fire</ion-option>
          <ion-option value="Wind">Wind</ion-option>
          <ion-option value="Structural Failure">Structural Failure</ion-option>
          <ion-option value="Snow/Ice">Snow/Ice</ion-option>
          <ion-option value="Burglary">Burglary</ion-option>

also the scrollbar scrolls forever.

did you check it css ? or did you use bootstrap ?

Not sure what you are asking. I am using ionic css. All of my other selects are working fine. This one isn’t.

l had problem with modal Controller dialog , just imagine every thing is working fine but only the modal Controller dialog when i launching he doesn’t show . Then l discovered the problem is with global scss . Styles of bootstrap 4 have the definition of modal class and turns display to none by default . l know my reply is far way about your question but just for check if your css is okay.

Thank you

Thanks. I’m not using a modal I’m using the alert api but I will look at the css.

1 Like

bro did you find the solution?? i do have the same problem now