iOS floating labels not shown after upgrade to beta.4

I just upgraded to beta.4 and noticed my floating labels on forms no longer display. I’m thinking it might be related to a recent change?

1 Like

Same issue here unfortunately.

I’m not seeing this in our e2e tests, can you provide some code, please?

Hi Brandy, I created a gist with the template code of my login screen.

here’s a screenshot from chrome:

and one from safari:

Oh I didn’t realize it was on Safari, sorry! Could you please create an issue for it on our repo and I’ll look into it?

Thanks! :slight_smile:

Sure, no problem!

I assume iOS uses the safari rendering engine exclusively… :wink:

I also have the same issue

Thanks for bringing this to our attention! This will be fixed with the release of 2.0.0-beta.5.

As a temporary workaround until then, you can add the following css to your app (after the Ionic import):

ion-label[floating] {
  flex-basis: auto;

For example, you could have a global Sass file at theme/ containing the above css, and then import that file in your theme/app.core.scss file:

// App Shared Imports
// --------------------------------------------------
// These are the various page imports which make up this app.
// By default each design mode includes these shared imports.
// App Shared Sass variables belong in app.variables.scss.

@import "./";

Let me know if you find any issues. :smile: