I have a mat-dialog with a mat-divider under the title text. I need that mat-divider extended all the way at both ends and touch the borders of the mat-dialog horizontally.
Here is my mat-dialog template html:
<h2 mat-dialog-title>This is a Dialog title</h2>
<mat-divider></mat-divider>
<mat-dialog-content>
<p> Place content here </p>
{{data}}
</mat-dialog-content>
<mat-dialog-actions>
<button class="mat-raised-button" (click)="close()">Close</button>
</mat-dialog-actions>
Here is the component scss style:
.mat-divider mat-divider-horizontal {
display: block;
margin: 0 !important;
padding: 0 !important;
border-top-width: 1px;
border-top-style: solid;
border-top-color: red;
}