question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[ionic v4] ion-label positioning broken after the 4.0.0.beta.1 release

See original GitHub issue

Ionic info

Ionic:

   ionic (Ionic CLI)          : 4.0.5 (/usr/local/lib/node_modules/ionic)
   Ionic Framework            : @ionic/angular 4.0.0-beta.1
   @angular-devkit/core       : 0.7.2
   @angular-devkit/schematics : 0.7.2
   @angular/cli               : 6.1.2
   @ionic/ng-toolkit          : 1.0.5
   @ionic/schematics-angular  : 1.0.4

System:

   NodeJS : v10.4.1 (/usr/local/Cellar/node/10.4.1/bin/node)
   npm    : 6.3.0
   OS     : macOS High Sierra

Bug Description The ion-label position seems not working properly. When we add the position attribute to the ion-label, its rendered in the wrong position.

Expected Behavior The convencional behavior of the ion-label component position.

Steps to Reproduce Steps to reproduce the behavior:

  1. Make a page with:
<ion-item>
    <ion-label position="floating">Floating Label</ion-label>
    <ion-input color="primary"></ion-input>
</ion-item>
  
<ion-item>
    <ion-label position="fixed">Fixed Label</ion-label>
    <ion-input color="secondary"></ion-input>
</ion-item>
  
<ion-item>
    <ion-label position="stacked">Stacked Label</ion-label>
    <ion-input color="danger" text-center></ion-input>
</ion-item>
  1. Run ‘ionic serve’
  2. See the error like the image below:
ion-label-broken

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:1
  • Comments:5 (1 by maintainers)

github_iconTop GitHub Comments

1reaction
manucorporatcommented, Aug 8, 2018

This is fixed in master! beta.2 will include the fix

0reactions
ionitron-bot[bot]commented, Sep 9, 2018

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Read more comments on GitHub >

github_iconTop Results From Across the Web

[ionic v4] ion-label positioning broken after the 4.0.0 ... - GitHub
The ion-label position seems not working properly. When we add the position attribute to the ion-label, its rendered in the wrong position.
Read more >
ionic 4 label display issue - Stack Overflow
1 Answer 1 · sry but this is not working, same problem here. but i think i found the solution: app is still...
Read more >
Floating ion-label how to make work with border - Ionic Forum
What I can't get working is the border around the component that looks like the example and where the label merges with the...
Read more >
Blog - Apache Cordova
Media Plugin 6.0.0 & Media Capture Plugin 4.0.0 Released! ... Fix landscape orientation defaults (since 6.0.0). A change made in Cordova iOS ...
Read more >
Release notes and release history for Mobiscroll
We fixed the event positioning on drag, when the event was jumping to the top row when it was assigned to multiple resources....
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found