CSS platform-ios


#1

Hi there,

I have a problem. I need to use the .platform-ios CSS, but it seems to doenst work and I dont know why.
When I use .platform-android or .platform-browser, ot’s working well, but .not platform-ios.

I tested on an iPhone 4s iOS7 and an iPhone5 iOS 8. Both doesnt work.
But that’s ok on my Nexus 5 (android).

If I understood, ionic has to add a class in the body, but not in my case. Please see the code I can see on Xcode :

<body ng-app="starter" animation="slide-left-right-ios7" id="bd">  

If you wanna see my CSS (it’s a test, obviously) :

.platform-browser { color: green; } /* ok */
.platform-android { color: yellow; } /* ok */
.platform-ios { color: red; } /* not ok */

Is anybody have an idea ?
Thanks a lot !


#2

I never test IOS7 on iPhone 4s.

But just try change for iphone 4s IOS 7 like this.

.platform-ios7 { color: red; }

and for IOS 8, you must use .platform-ios8

.platform-ios8 { color: red; }

#3

I have already try, and it doesnt work too :frowning:


#4

Have you tried targeting a class, eg. put X into your outer element:

.platform-android .X
{
margin-bottom: 30px;
}


#5

Yes I tried. But it’s working, the problem came to the cache of the platforms folder.

Thank you guys anyway.


#6

Hmm, so I tested this using this css

.platform-browser h1 { color: green; }
.platform-android h1 { color: blue; }
.platform-ios h1 { color: red; }

And it works fine on actual device.