Android ionic bug

I’m testing my app on a Huawei G535 and the layout is way out of position and the buttons do not click. I am using Ionic 2.
I tested this on my emulator and browser and everything is fine.
I don’t have another phone to test it on, but if there is a problem on my phone, then I think it could affect other phones as well.

Android info-
Resolution: 540 x 960
Android Version: 4.3
Emotion UI version: EmotionaUI 2.0 Lite
Baseband version: 100131

Any advice on what could be wrong?
Many thanks

Code for my page.
<ion-header> <ion-navbar color="primary"> <ion-title> Title </ion-title> </ion-navbar> </ion-header>
<ion-content padding>
<ion-list no-lines> <ion-item *ngFor="let item of items | async"> <ion-avatar item-left> <img src="{{item.image}}"/> </ion-avatar> <h1>{{item.title}}</h1> <button ion-button clear item-right large (click)="showItem(item)"> <ion-icon name="arrow-dropright"></ion-icon> </button> </ion-item> </ion-list>
</ion-content>

UPDATE
After looking around I seen it could be outdated ionic version as the problem.
So I update my ionic app to the latest version. I can now use the button to navigate to another page on my Huawei phone. But the buttons and positions are still wrong. The list is shown as compressed list all on the left side of the phone, the title in the navbar has no margin.
When I get to the other page, the back arrow button is above the title on the navbar and the button to a link does not work.


UPDATE
I created a new ionic 2 and only changed the home.html file to a list. But it is the same outcome.
I do no get any console errors.

Found out the problem is the android version.