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

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

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

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

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


angular-material mat-table
person Chatra    schedule 27.12.2018    source источник

Ответы (1)


arrow_upward
7
arrow_downward

Вы можете использовать свойство 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%
}

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

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

person ark    schedule 27.12.2018
comment
есть ли способ определить одинаковый размер для столбца даже при изменении размера экрана? stackoverflow.com/questions/65296518/ - person app; 15.12.2020
comment
stackoverflow.com/questions/65296518/ - person app; 15.12.2020