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

md-input-containers text and floating label misaligned when using mdPrefix #3229

Closed
WillAnd31 opened this issue Feb 21, 2017 · 2 comments
Closed
Assignees
Labels
P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent

Comments

@WillAnd31
Copy link

WillAnd31 commented Feb 21, 2017

When using a md-icon as a prefix to an input inside of an md-input-container the floating label gets misaligned when using a mdPrefix, as you can see below:

screen shot 2017-02-21 at 12 30 40 pm

screen shot 2017-02-21 at 12 31 33 pm

The expected behavior is to have the text aligned with the icon and also have the floating label be at the correct position. As you can see when there is no mdPrefix icon the text is all aligned how it should be:

screen shot 2017-02-21 at 12 31 01 pm

screen shot 2017-02-21 at 12 31 16 pm

To reproduce this simply add a mdPrefix to a md-input-container.
Before:

<md-input-container>
    <input mdInput placeholder="text" type="text" name="example">
</md-input-container>

and after:

<md-input-container>
    <md-icon mdPrefix>email</md-icon>
    <input mdInput placeholder="text" type="text" name="example">
</md-input-container>

Right now using mdPrefix is making the input not look good. If I am using mdPrefix wrong please let me know.

@kara kara added the P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent label Feb 21, 2017
@fxck
Copy link
Contributor

fxck commented Feb 22, 2017

dupe of #2586 I believe

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 5, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent
Projects
None yet
Development

No branches or pull requests

4 participants