css - Angular Material 6 网格列表对齐元素和对齐内容到 flex-start

Question

我正在尝试使用 Angular Material 6 动态网格列表。与文档相关的示例将网格的内容放在每个图 block 的中心。参见示例 here

我希望内容位于每个图 block 的左上角。

我已经尝试了以下不起作用的 css。

.mat-grid-tile .mat-figure {
   justify-content: flex-start;
   align-items: flex-start;
}

Answer 1

放入styles.css:

DEMO

.mat-grid-tile .mat-figure {
   justify-content: flex-start !important ;
   align-items: flex-start !important;
}