What problem does this address ?
1. hasFixedLayout is not exposed in the block settings UI
In the block.json file for the Table block, there is an attribute :
https://github.com/WordPress/gutenberg/blob/trunk/packages/block-library/src/table/block.json
"hasFixedLayout": {
"type": "boolean",
"default": true
}
However, this value is not configurable from the block sidebar (Inspector Controls).
This means users cannot toggle between table-layout: fixed and auto without custom code or filters.
👉 Request: Can this attribute be exposed in the UI as a toggle, or at least allow for easier overrides via block filters or global settings?
2. Responsive behavior does not work without custom CSS
By default, the Table block includes styles like :
.wp-block-table {
overflow-x: auto;
}
.wp-block-table .has-fixed-layout {
table-layout: fixed;
width: 100%;
}
But this alone does not make the table responsive on small screens, especially when long content is involved.
To make tables truly responsive, we had to add the following CSS (used inside a media query) :
@media (max-width: $screen-wp-sm-max) {
.wp-block-table {
table {
width: max-content !important;
table-layout: auto !important;
}
}
}
Without this, the table remains rigid and does not allow horizontal scrolling as expected.
👉 Request: Could the default responsive CSS for the Table block be improved to better handle overflow and layout issues on mobile/tablet/desktop devices ?
What problem does this address ?
1. hasFixedLayout is not exposed in the block settings UIIn the block.json file for the Table block, there is an attribute :
https://github.com/WordPress/gutenberg/blob/trunk/packages/block-library/src/table/block.json
However, this value is not configurable from the block sidebar (Inspector Controls).
This means users cannot toggle between table-layout: fixed and auto without custom code or filters.
👉 Request: Can this attribute be exposed in the UI as a toggle, or at least allow for easier overrides via block filters or global settings?
2. Responsive behavior does not work without custom CSS
By default, the Table block includes styles like :
But this alone does not make the table responsive on small screens, especially when long content is involved.
To make tables truly responsive, we had to add the following CSS (used inside a media query) :
Without this, the table remains rigid and does not allow horizontal scrolling as expected.
👉 Request: Could the default responsive CSS for the Table block be improved to better handle overflow and layout issues on mobile/tablet/desktop devices ?