mat-table - Как обновить ширину столбца

Question

У меня есть три столбца в мат-таблице.

Первый столбец номер, третий столбец дата, а второй столбец содержит большую строку.

Я хочу, чтобы первый столбец был 15px, третий столбец - 100px, а средний столбец остальной ширины. В процентах 5%, 85% 10%.

Как я могу добиться этого в мат-таблице?

Answer 1

Вы можете использовать свойство flex для достижения желаемого поведения.

 //First column and header
.mat-header-cell:first-child,.mat-cell:first-child{
  flex:5%;
}
//Second column and header
.mat-header-cell:nth-child(2),.mat-cell:nth-child(2){
  flex:85%;
}
//Last column and header
.mat-header-cell:last-child,.mat-cell:last-child{
  flex:10%
}

Вот ссылка на стек, чтобы увидеть демо.

https://stackblitz.com/edit/angular-155qbp