I need to create a footer with 2 simple rows the company name and the year. Here is my html snippet,
<mat-toolbar color="primary" style="height: 176px">
<span>Company name</span>
<span>Copyright ©2019</span>
</mat-toolbar>
So that company name has to be at the center (vertically and horizontally) and the copyright should be below of the company name.
Just place the spans into a mat-toolbar-row. They are basically made for structuring content in lines.
<mat-toolbar>
<mat-toolbar-row>
<span class="span">First Line</span>
</mat-toolbar-row>
<mat-toolbar-row>
<span class="span">Second Line</span>
</mat-toolbar-row>
</mat-toolbar>
Then you just have to center the spans.
.span {
margin: auto;
}