bug(table): Specifying max-width with % on a table column doesn't work

[sdedieu]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

Hello 👋

It might be a duplicated issue, but I couldn't find the exact same in the previous ones....

I'd like to specify a max-width: 20% on a table column. However it does not seems work.

What I'm I missing ?

Reproduction

StackBlitz link: https://stackblitz.com/edit/eqepaugy-ht92gcfb?file=src%2Fexample%2Ftable-basic-example.html
Steps to reproduce:

1. Open the StackBlitz
2. Resize the Symbol column (it is not supposed to be wider than 5%, yet it can)

Expected Behavior

Being able to specify a max-width in % for some columns.

Actual Behavior

max-width in % on <table mat-table> columns are not taken into account.

Environment

• Angular: 19, 18, 17, 16, 15
• CDK/Material: 19, 18, 17, 16, 15
• Browser(s): Chrome, Firefox
• Operating System (e.g. Windows, macOS, Ubuntu): Mac

[shhdharmen]

You can not apply style to ng-container.

[sdedieu]

You can not apply style to ng-container.

Good catch, it is a silly mistake I did creating the stackblitz example. I've updated it, but the question still remains.

It works with [style.width.%]="5" but not with [style.max-width.%]="5".

[shhdharmen]

It's more of a CSS thing I believe, not related to Angular Material.

[sdedieu]

It's more of a CSS thing I believe, not related to Angular Material.

Do you mean it is not possible to set the max-width of a td element ? 🧐

[sdedieu]

https://stackblitz.com/edit/vitejs-vite-eeuq4ggj?file=src%2Fmain.js,src%2Fstyle.css

Oh mmhh ok didn't know about that