CODEWITHSUNDEEP
ionic2
Goldbones
Goldbones

Reputation: 1457

Customize ion select on Ionic 2

At this moment ion combox is in front of ion label in the middle.

enter image description here

I want to put text on top and combobox selection below:

enter image description here

Is this possible on ionic 2?

EDIT:

HTML code follows Ionic API Documentation:

<ion-item>
  <ion-label>Align on Top</ion-label>
  <ion-select [(ngModel)]="align">
    <ion-option value="t">top</ion-option>
    <ion-option value="m">middle</ion-option>
  </ion-select>
</ion-item>

Upvotes: 0

Views: 3338

Answers (1)

rashidnk
rashidnk

Reputation: 4292

You can add this in .SCSS page and adjust values as needed

.select-md .select-icon,.select-ios.select-icon {
    position: absolute;
    width: 12px;
    height: 19px;
    left: 15px;
    top: 26px;
}

and change the label to stacked

<ion-label stacked>Align on Top</ion-label>

Upvotes: 1

Related Questions