Error rendering list width Motorola RAZRi 4.1.2


#1

Well, this happened when using ionic in the phone of a friend of mine. I have no idea why it happens.
All I can say is that, if the problem is on ionic, it is a deal breaker. The problem doesn’t happen on my MotoG.

source"


#2

@mhartington heard about it?


#3

Hmmm, never heard or saw this before…

Any chance you could try out one of the sample list app from codepen?


#4

The stock browser renders it all wrong… Like if width 100% wasn’t working.


#5

Any chance you could use weinre and see why the right styles aren’t being applied?

I dont have a RAZRi so I can really test this.


#6

Hey @mhartington! So I spent some minutes checking this issue and it seems that the main issue is: directive-elements aren’t recognized as block, but probably as inline-block.

I did a quick check with the following:

ion-list, ion-view, ion-item {
    display: block;
    width: 100%;
}

And some stuff started working… After some tweaks I noticed that just adding the display: block was enough.

I tried to find differences between a MotoG and the RAZRi and it was kinda hard:

Body class for RAZRi platform-android platform-cordova platform-webview grade-b platform-browser platform-android4 platform-android4_1 platform-ready

Body class for MotoG platform-android platform-cordova platform-webview grade-a platform-browser platform-android4 platform-android4_4 platform-ready

The only difference was this grade-a and grade-b, so my suggestion/idea is to identify a bit better when the device uses an older/non-chrome engine and add some ion-support class. And inside of this create some supporting styles.

I will try to work a bit more at home today.

For now I believe I had enough information :smile:


#7

Hmm, still with the platform grades, this shouldn’t change the whole display value.

Mind posting an issue for this and include the info you’ve found?


#8

Took some time to test in a older device and it worked ok…
I think there’s somethig messed up with that device…