The icon in the button doesn't align correctly

Ionic Framework ionic-v3
1

hello,

when i use icon button, the component renders correctly on ionic serve , but if i check on simulator and on the real device the icon is adjusted to the right. here is the code

<button fab class="btn-swap" (click)="swapStartEnd()"><ion-icon ios="ios-swap" md="md-swap"></ion-icon></button>

.btn-swap {
  z-index:          20;
  right:            0;
  top:              45%;
}

blow capture is from the ios simulator

ios simulator
image

blow capture is from the ionic serve

ionic serve
image

how can i get this correct??

thank you

2

I recently discovered this same strange behaviour. Can anyone elaborate on this? I had two Iphone 5c devices, both on same iOS (even same color :wink: )., same builds, same updates. The first one displayed the icons in the mini-fab correct, the other one aligned them to the right. I definitely think this is some kind of bug

3

I had no chance to check this issue lately, but android seems fine.
I only had this issue with iphone