<md-card-content> breaks <md-select> vertical alignment

[jt-helsinki]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

All inputs vertically align.

What is the current behavior?

If a select is placed next to an input inside an <md-card-content> there is an alignment issue.

What are the steps to reproduce?

See this Plunk

http://plnkr.co/edit/eVQA4NAMfWQ9kjpvl5RR?p=preview

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

Correct layout required.

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

Material 2.0.0-beta.10
Angular 4.3.6
flex-layout 2.0.0-beta.9

Is there anything else we should know?

[willshowell]

.mat-card-content sets the font size to 14px which decreases the form field's height

[jt-helsinki]

For now the work around is to override the .mat-card-content style by setting the font-size to 16px. Not ideal...

[willshowell]

I think moving select to work inside form-field will fix this (#6488). @mmalerba can you confirm?

[mmalerba]

yep, then select will also adapt to the current font-size

[jt-helsinki]

@mmalerba @willshowell OK, thanks. Hopefully in the next release.

current font-size

Do you mean the font-size of the <md-card-content>?

[willshowell]

@raceloop yes. If inside md-card-content, both will inherit the font size of 12px and decrease in height. If outside md-card-content they will inherit whatever font size is set there (in this case, 16px).

[josephperrott]

Closed as #6488 was merged.

[angular-automatic-lock-bot]

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.}