Как отрегулировать высоту строки списка сетки угловых материалов в CSS? - PullRequest
Новая
       7

Как отрегулировать высоту строки списка сетки угловых материалов в CSS?

0 голосов
/ 04 октября 2019

Я использую угловой с угловым материалом для какого-то проекта для универа. Я не первый раз работаю с угловым материалом.

В этом проекте я пытаюсь добраться до этого дизайна: design. Это также должно быть отзывчивым (например: на телефоне это должно быть только 1 квадратная штука). Чтобы сделать это отзывчивым, я подумал об использовании CSS-запросов, поскольку они несколько надежны, и я с ними знаком. Подходя к моему случаю: очевидно, я не могу настроить свойство rowHeight / cols в mat-grid-list. Кто-нибудь знает способ сделать это в любом случае? Так как он должен быть отзывчивым, я должен быть в состоянии настроить оба из них. 

<mat-grid-list cols="3" rowHeight="600px">
      <mat-grid-tile id="monday">
        <mat-card>
          <mat-card-header>
            <mat-card-title>
              {{ monday.text }}
            </mat-card-title>
            <mat-card-subtitle>
              {{ monday.date | date }}
            </mat-card-subtitle>
          </mat-card-header>
          <mat-card-content>
            <p>
              icon
              icon
            </p>
            <hr />
            <p>icon</p>
            <p>icon</p>
            <hr />
            <p>icon</p>
            <hr />
            <p>icon</p>
            <hr />
            <p>icon</p>
          </mat-card-content>
        </mat-card>
      </mat-grid-tile>
</mat-grid-list>

mat-grid-list {
  rowheight: 600px; /* vs-code gives the following error: unknown property: "rowHeight" */
}
...