MdDialog container padding does not match spec

Bug, feature request, or proposal:

MdDialog (<md-dialog-container>) currently pads the entire child (user-supplied) content with 24px. It should not pad the action content (or rather, pad according to the spec).

What is the expected behavior?

It should only pad the non-action content. Source

What is the current behavior?

It pads all the content.

What are the steps to reproduce?

See here.

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

To match the Material spec.

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

Angular & Material: current OS: any/all

Is there anything else we should know?

n/a

[Haske107]

Have we found a fix for this? I can remove the 24px padding via Chrome Dev Tools as .mat-dialog-container but not within CSS.

[Xapuu]

Here is my solution, which i think will work for most of the cases, without messing with the view encapsulation prop.

• First set custom class on your dialog box

this.dialog.open(myDialogComponent, {
  panelClass: 'my-dialog'
 });

• Second - put the custom css in your global style.scss and target whatever you feel like (the container in this case)

.my-dialog {
    .mat-dialog-container {
		padding: 0;
		background: none;
                 {{And all the rest of the css you need}}
     }
}