Snackbar fills whole screen on deploy

[trevordowdle]

Reproduction

Steps to reproduce:

1. Open the Basic snack-bar example in stackblitz.
2. Fork the project and perform a firebase deploy via stackblitz.
3. Open the deployed project in Safari and summon forth a snackbar.

Expected Behavior

What behavior were you expecting to see?
A snackbar

Actual Behavior

What behavior did you actually see?
A supersized jumbo snackbar

Environment

Safari, on Mac OS and IOS

This only happens on the deployment version, I can't figure out what is causing it. But i'm hoping someone could help know what changes can be made in the stackblitz project in order for the bug not to show up on deploy. Or is this strictly a firebase deployment bug?

I found a reference to a similar issue here, the solution seemed simple enough and was due to not closing html tag(s) properly or not having an html doc type declaration. However I tried checking both of those things and it still happens after deploy.

[trevordowdle]

Any help? Ideas? Thank you

[andrewseguin]

The issue seems to be the height: 100% set on the simple-snack-bar. It's not clear to me why we have that style set.

https://github.com/angular/components/blob/master/src/material/snack-bar/simple-snack-bar.scss#L17

We can try removing that line to see what adverse changes that causes to projects internally at Google. If nothing is affected then I think we can safely remove it.

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