Как исправить различную иконку ионной вкладки на устройствах Android и iOS?

Question

Я изменяю стиль моей кнопки ионной вкладки, чтобы центральная кнопка была больше, чем другие. На моих устройствах Android она выглядит нормально, но при развертывании на устройствах iOS центральная кнопка отображается неправильно. Где мне нужно изменить, чтобы исправить проблему стиля?

.ion-ios-homeImg:before{
  content: '';
  width: 60px;
  height:60px;
  display: block;
  background: no-repeat center url("../assets/imgs/scantab.png");
  background-size: contain;
}

.ion-ios-homeImg-outline:before{
  content: '';
  width: 60px;
  height: 60px;
  display: block;
  background: no-repeat center url("../assets/imgs/scantab.png");
  background-size: contain;  
}
.ion-md-homeImg:before{
  content: '';
  width: 60px;
  height: 60px;
  display: block;
  background: no-repeat center url("../assets/imgs/scantab.png");
  background-size: contain; 
}

.tab-button-icon{
  overflow: visible;
}

.tab-button.has-icon.icon-only.disable-hover {
  position: relative;
  .tab-button-icon{
    position: fixed;
    bottom: 16px;
    left: calc(50% - 30px);
    z-index: 9999999;
}

1.Android https://github.com/yl847866341/Heart/blob/master/QQ20190125-0.png
2.iOS https://github.com/yl847866341/Heart/blob/master/Screenshot_2019-01-25-11-05-39-185_com.legend.sta.png

Answer 1

Я отлаживаю свое приложение на симуляторе и меняю нижнюю часть на 30px. Проблема была решена.