Edit profile form field labels overlap placeholders
See original GitHub issueObserved behavior
Happens in Chrome on Ubuntu, and only on the first load when the user is invited to update their profile. Subsequent entering the Edit
profile page displays the labels correctly.
Expected behavior
Labels should not overlap the field.
User-facing consequences
Unreadable text, unclear function of the field.
Errors and logs
…
Steps to reproduce
Login as the user who is still missing the demographic data, so Kolibri directs you to update their profile.
Context
- Kolibri version: current
develop
branch - Operating system: Ubuntu 18.04
- Browser: Chrome, but not Firefox
Issue Analytics
- State:
- Created 4 years ago
- Comments:5 (5 by maintainers)
Top Results From Across the Web
placeholder text overlapping issue - Jotform
I have an issue with the placeholder text overlapping the actual input field text - I think this is caused by the fact...
Read more >React Material UI Label Overlaps with Text - Stack Overflow
If I click on each field, the label moves up as expected. However, at the page load, labels do not move up. I...
Read more >Input label does not move up when value or placeholder is sp
I am trying to use mdbootstrap in my meteor app but am running into issues with forms: the label does not move above...
Read more >Textfield label overlaps if input has placeholder #243 - GitHub
This provides a display where the placeholder overlaps the label making both unreadable. Placeholders are pretty common when you are ...
Read more >Chrome autofills the Form and the floating label overlaps the ...
I am using the Telerik Form for Blazor. When the application is rendered in Chrome, the browser automatically completes the fields of the...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
The only difference I can tell between the okay case “Profile -> Edit Profile” and the bad case “Notification -> Edit Profile” is that the bad case goes across plugins (Learn -> User), whereas the ok case doesn’t. It seems like it’s probably something related to JS performance, or timing.
closing as stale