Incorrect max-width: 0px; when using fxFlex="1 1 0px"

[AbakumovAlexandr]

Bug, feature request, or proposal:

Bug.

What is the expected behavior?

Effect of generated CSS properties in case of fxFlex="1 1 0px" should match the one of flex: 1 1 0px;.

What is the current behavior?

When you use fxFlex="1 1 0px", max-width: 0px; is getting added to an element which breaks displaying of the element in some cases.

What are the steps to reproduce?

This is side-by-side demonstration of the issue with a simplified layout from my project:
StackBlitz

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

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

Tested in IE 11, Edge, FF 57, Chrome 63.0.3239.84.
Angular 5.1.1, Material 5.0.1, Win 10, TS 2.4.2.

Is there anything else we should know?

[ThomasBurleson]

Related to #280, #277, #538, #528