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.

Sign up for GitHub

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

Jump to bottom

Icons are not vertically aligned inside mat-option elements #9978

Closed
benelliott opened this issue Feb 16, 2018 · 1 comment · Fixed by #9982
Closed

Icons are not vertically aligned inside mat-option elements #9978

benelliott opened this issue Feb 16, 2018 · 1 comment · Fixed by #9982
Assignees
@crisbeto
Labels
P4 A relatively minor issue that is not relevant to core functions

Comments

@benelliott
Copy link
Contributor

Bug, feature request, or proposal:

mat-icon instances are not vertically aligned with the option text when placed inside mat-option elements.

What is the expected behavior?

Icons should be vertically aligned.

What is the current behavior?

Not vertically aligned.

What are the steps to reproduce?

https://stackblitz.com/edit/angular-material2-issue-5num53

What is the use-case or motivation for changing an existing behavior?

Aesthetics, plus consistency with other APIs like mat-menu-item in which icons are vertically aligned by default.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Latest StackBlitz template, Chrome 64, Win 10

Is there anything else we should know?

Maybe vertical-align: middle should be added to mat-menu-item-base here and removed here.
@crisbeto crisbeto self-assigned this Feb 16, 2018
@crisbeto crisbeto added has pr P4 A relatively minor issue that is not relevant to core functions labels Feb 16, 2018
crisbeto added a commit to crisbeto/material2 that referenced this issue Feb 16, 2018
@crisbeto
fix(select): icons inside option not centered
983951c 
Fixes `mat-icon` instances inside a `mat-option` not being centered vertically.

Fixes angular#9978.
@crisbeto crisbeto mentioned this issue Feb 16, 2018
Merged
jelbourn pushed a commit that referenced this issue Feb 18, 2018
@crisbeto @jelbourn
fix(select): icons inside option not centered (#9982)
9914312 
Fixes `mat-icon` instances inside a `mat-option` not being centered vertically.

Fixes #9978.
tinayuangao pushed a commit that referenced this issue Feb 20, 2018
@crisbeto @tinayuangao
fix(select): icons inside option not centered (#9982)
7c123b8 
Fixes `mat-icon` instances inside a `mat-option` not being centered vertically.

Fixes #9978.
andrewseguin pushed a commit that referenced this issue Feb 20, 2018
@crisbeto @andrewseguin
fix(select): icons inside option not centered (#9982)
ecc7f53 
Fixes `mat-icon` instances inside a `mat-option` not being centered vertically.

Fixes #9978.
@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 8, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@crisbeto crisbeto

Labels
P4 A relatively minor issue that is not relevant to core functions
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(select): icons inside option not centered crisbeto/material2
2 participants
@crisbeto @benelliott