md-select affects flexbox (and also alignments with width=100% or table/table-cell)

[Mario-Eis]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

md-select should align correct in a flexbox

What is the current behavior?

The placeholder of the md-select gets a width assigned and is then scaled down. This assigned width seems to large. It destroys the alignment of the outside flexbox.

(here the margin on the right side seems to be ignored. But its the md-select placeholder that forces the button to the right)

Further the assigned size prevents the md-select from resizing (Smaller. Larger works because the md-select just can't get smaller as the assigned width of the placeholder)

What are the steps to reproduce?

e.g. a md-select next to a button in a flexbox
See this Plunkr: http://plnkr.co/edit/tThcD4?p=preview

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

Possibility to (dynamicaly) align a md-select.

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

Angular 4.0.1, Material beta3, Chrome

Is there anything else we should know?

This seems to fix the issue (but I don't know of any side effects)

span.mat-select-placeholder.mat-floating-placeholder {
  width: auto !important;
}

Maybe there is a relation to #3073

Update: The issue doesn't only affect flexboxes but also alignments with width=100% or table/table-cell

[jelbourn]

Closing this since I believe it's obsolete now that mat-select goes into mat-form-field

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