Repository navigation
Add column-width to text column support #76363
Description
What problem does this address?
I was excited to see that text column support was added to the paragraph block. But when I tested it, I noticed that only column-count appears to be supported. Without including a column-width property, a very nice looking 3-column layout like this:
will end up looking like this on mobile:
whereas a sensible column-width property would cause the number of columns to reduce as the screen gets narrower.
I have a hard time imagining anyone is actually using this feature in production given this limitation.
What is your proposed solution?
Add column-width support to the column block support.
Activity
sidhant-tomar-003 commentedon Mar 11, 2026
Hi, I'd like to work on this issue.
My plan is to add a
textColumnMinWidthstyle property that maps to the CSScolumn-widthproperty.column-widthwill set the minimum width a column can be before the browser drops i. So combined withcolumn-count, the layout collapses naturally on narrower screens without any media queries.The control would appear alongside the existing column count picker in the Typography panel, with Small (16em), Medium (24em), and Large (32em) presets. Using
emshould ensure that the breakpoints stay proportional to the block's font size.Will open a PR once I have something working 👍
Shekhar0109 commentedon Mar 12, 2026
I’ve opened a pull request implementing this feature: #76450.
The PR adds support for a minimum column width (
column-width) alongside the existingcolumn-countsetting in the Typography panel. This allows the number of columns to automatically reduce on narrower screens, improving responsiveness.Feedback and suggestions are welcome.
sidhant-tomar-003 commentedon Mar 25, 2026
I've opened a PR that adds
column-widthsupport to the text columns block support: #76781This pairs
column-widthwith the existingcolumn-countso that columns adapt responsively to the available space instead of being forced at all viewport widths. I followed the font-size pattern in terms of UI and controls logic, and also consolidated the prop for columns control into a separate component for better organization 👍