CSS for Ionic 2 Select Option

@dbertels wrote:

The standard html for an ionic 2 selection inside an ion-list is

...
<ion-item>
    <ion-label>Relationship</ion-label>
    <ion-select [(ngModel)]="relationship">
        <ion-option value="Spouse">1. Spouse / De Facto</ion-option>
        <ion-option value="Carer">2. Unpaid Carer</ion-option>
        <ion-option value="Friend">3. Friend / Family</ion-option>
    </ion-select>
</ion-item>
...

However this produces some unsightly results when the selection entryis slightly oversized, e.g.

Is there a way to alter the format in CSS? I tried
<ion-select class="fancy-select" [(ngModel)]="relationship">
and in the css:

.fancy-select{
  padding: 0;
  white-space: normal;
  display: block;
  text-align: left;
}

I also tried adding formatting to the label - but nothing seems to make much impact..

Posts: 1

Participants: 1

Read full topic