When I open a Material dialog (MdDialog.open(MyDialogComponent)), the dialog that opens spans the entire height of my screen.
When I remove height:100% from .md-dialog-container in Chrome inspector, the height is adjusted to fit the contents perfectly.
But the source code of md-dialog makes it look like this is intentional:
md-dialog-container {
...
// The dialog container should completely fill its parent overlay element.
width: 100%;
height: 100%;
...
}
I've already removed Material for Angular 1 from my project to avoid CSS conflicts with Material for Angular 2. (The old css was making the width overly large too.)
What could cause this or how do I troubleshoot it?
My dialog component is simple:
<h2 md-dialog-title>...</h2>
<md-dialog-content>
...
</md-dialog-content>
<md-dialog-actions align="end">
<button... />
</md-dialog-actions>
