angular / components

Component infrastructure and Material Design components for Angular
https://material.angular.io
MIT License
24.39k stars 6.76k forks source link

bug(material/table): fixedLayout not applied #26565

Open rengert opened 1 year ago

rengert commented 1 year ago

Is this a regression?

The previous version in which this bug was not present was

14.2.0

Description

If the attribute fixedLayout is set, the styling is not applied. The corresponding css classes are, but the style not. Table layout is always set to auto.

Reproduction

Steps to reproduce:

  1. set fixedLayout to true
  2. Check the style of table

Expected Behavior

The table-layout: fixed style is applied

Actual Behavior

The table-layout: auto style is applied, wenn fixedLayout is true

Environment

Zacherl commented 1 year ago

I also have this issue. Is there a fix for it?

charmbv commented 1 year ago

Still exists in CDK/Material v16.0.0.

mbozsoki commented 1 year ago

It is still an issue. Even though I am setting the fixedLayout property to true on the Material Table, the default table-layout: auto gets applied over 'table-layout: fixed'.

This issue has been around since the v15 update and still a problem in v16.

Screenshot 2023-06-09 at 11 21 01

Example

After some investigation in the table.scss I found this issue According to the issue, the additional 'table-layout: auto' override was added in order make the Material Table backwards compatible, since the browser default is 'auto'.

However, if someone wants to apply 'fixed' to the table there is no way to do it right now. Setting the 'fixedLayout' property to 'true' will bind the '.mdc-table-fixed-layout' to the table. This class however does not apply any styles.

In order to apply 'fixed' table layout I had to add a custom css workaround rule in my application:

.mat-mdc-table.mdc-table-fixed-layout {
    table-layout: fixed;
}

h3. Proposal If backwards compatible should be maintained, the default table-layout should be set to 'auto' without an overriding class. Then when fixedLayout addes the '.mdc-table-fixed-layout' class to the table 'table-layout: fixed' should override the default table-layout.

charmbv commented 10 months ago

Still an issue with v17 of Angular Material/CDK.

Ade-mir commented 7 months ago

Any resolution to this?

b-mi commented 1 day ago

Still an issue with v18 of Angular Material/CDK.