Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

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

See original GitHub issue

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?

Issue Analytics

State:
Created 6 years ago
Comments:8 (5 by maintainers)

Top GitHub Comments

1reaction

willshowellcommented, Sep 13, 2017

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

0reactions

angular-automatic-lock-bot[bot]commented, Sep 7, 2019

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

Top Results From Across the Web

angular-material-styles | Yarn - Package Manager

... CSS, UX changes that will cause breaks in existing AngularJS Material applications). ... fix icon vertical alignment within md-button.

How center a angularjs material card (md-card) vertically and ...

I'm building a simple login page where I've a angular material card (md-card) and nothing more. Inside it I've the normal fields in...

Untitled

... (2018-04-27) ### Bug Fixes * **autocomplete:** align highlight style with spec ... **input/autocomplete:** prevent md-select-on-focus from refocusing ...

angular-material/CHANGELOG.md - UNPKG

355, * **input/autocomplete:** prevent md-select-on-focus from refocusing blurred input ... 1211, * fix icon vertical alignment within md-button.

Supplement other js/css files · 8f7db83c5c - xstatic-angular ...

break ;. default: cache[key] = pair[1]; ... This is a mixin, which fixes IE11's vertical alignment issue, ... md-backdrop.md-select-backdrop {. z-index: 81;.