Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Floatlabel overlaps placeholder #17260

Open
1 of 4 tasks
docentYT opened this issue Dec 30, 2024 · 0 comments · May be fixed by #17298
Open
1 of 4 tasks

Floatlabel overlaps placeholder #17260

docentYT opened this issue Dec 30, 2024 · 0 comments · May be fixed by #17298
Labels
Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible

Comments

@docentYT
Copy link

Describe the bug

When the floatlabel is displayed on the ‘input’ element, the placeholder is visible so that the two texts overlap. In primeng version 17, the placeholder was only displayed when the input was active and the floatlabel was displayed over the field.

{4A1476A0-A9BD-49D7-A0DE-9FEC55FA5475}

Pull Request Link

No response

Reason for not contributing a PR

  • Lack of time
  • Unsure how to implement the fix/feature
  • Difficulty understanding the codebase
  • Other

Other Reason

No response

Reproducer

https://stackblitz.com/edit/github-n5jhznk4?file=src%2Fapp%2Fapp.component.html

Environment

Nx monorepo with angular app

Angular version

19.0.5

PrimeNG version

v19

Node version

22.12.0

Browser(s)

No response

Steps to reproduce the behavior

  1. Check results for:
<p-floatLabel>
  <input type="text" pInputText id="website" placeholder="placeholder" />
  <label for="website">Label</label>
</p-floatLabel>

Expected behavior

The placeholder should be hidden when the floatlabel is displayed on the input field.

@docentYT docentYT added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Dec 30, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant