Angular Material: How to change top padding of mat-grid-tile
Setting rowHeight of mat-grid-list works for me, the G. Tranter doesn't work because the mat-grid-list has a padding It's set dynamically too and cannot be setted with !important.
<!-- 70px to prevent hide floatLabel in matInput -->
<mat-grid-list cols="2" rowHeight="70px">
<mat-grid-tile>
<!-- your controls -->
</mat-grid-tile>
</mat-grid-list>
Ref: https://material.angular.io/components/grid-list/examples
"@angular/material": "^6.4.3"
"@angular/core": "^6.1.0"
The grid tile component sets top padding dynamically on the element itself, so you need to use the !important modifier in your CSS to override it.
HTML:
<mat-grid-tile class="my-grid-tile"></mat-grid-tile>
CSS:
.my-grid-tile {
padding-top: 24px !important;
}