Remove weird border on material dialog

I use Angular material 6 dialog component. It showed a weird border. Can you tell me how to remove that? I have tried like below. But it is not working. If I do that inside the browser (inline) then it works. Any clue?



dialog.component.html

<h1 mat-dialog-title>Confirm</h1>
<div mat-dialog-content>
<p>Are you sure wanted to delete the account?</p>
</div>
<div mat-dialog-actions>
<button mat-button cdkFocusInitial [mat-dialog-close]="false">Cancel</button>
<button mat-button [mat-dialog-close]="true">Delete</button>
</div>


dialog.componet.css

dialog.ng-star-inserted {
border: none !important;
}

Continue reading...