Wow, super in-depth follow-up. Thanks for your time!
The lack of borders and padding might/could be fixed with display:table-row-group and border-spacing.
Making the headers full-width might work by leaving them out of the table layout algorithm — leave ’em as block, and reorient where the cells start by abusing writing-mode. (I’ve done things I’m not proud of.)
…but all that’s definitely deep in the weeds of hackiness. (And let’s not talk about display:table-caption, which hoists the child box out of the border-box of its parent.)
If the CSS Table Layout specification had equivalents to colspan and rowspan, we would have been halfway to Grid in 2009. But I can’t blame them for underspecifying the weirdest, most browser-specific layout system ever accidented.
Full-time web dev; JS lover since 2002; CSS fanatic. #CSSIsAwesome
I try to stay up with new web platform features. Web feature you don't understand? Tell me! I'll write an article!
He/him
Good idea, forgot about display: table-row-group, that does make the borders somewhat work again.
But leaving the header and .top wrapper as a block doesn't fix the colspan problem, which is now manifesting in a really weird way... Without checking the spec, it feels like the children of a table-row-group are in some sort of all-or-nothing pact, where if any one of them is given display: table-row (and has at least one table-cell child?), they all act like table-rows with table-cell children. But if none of them have a table display type, they act like blocks, even if one has table-cell children...
Yeah, I have mixed feelings about CSS Tables. I almost think it's better that it was kept small and arguably incomplete; maybe its holes helped motivate CSS Grid? Maybe if it had been more complete, people would have continually pointed to tables whenever someone brought up Grid, the same way some currently point to display: contents when someone mentions subgrids. But on the other hand, if we're going to have a table layout system anyway, might as well make it fully functional. Maybe they could augment it now to complete the picture.
Full-time web dev; JS lover since 2002; CSS fanatic. #CSSIsAwesome
I try to stay up with new web platform features. Web feature you don't understand? Tell me! I'll write an article!
He/him
By the way, thanks for the replies, it's been very interesting! I forget that CSS Tables are a thing, and they're worth remembering for those odd corner cases
Ken, thanks for giving a great and detailedwrite-up on the need for subgrid.
I've been frustrated by the lack of subgrid on grid frameworks for a while now.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Wow, super in-depth follow-up. Thanks for your time!
The lack of borders and padding might/could be fixed with
display:table-row-group
andborder-spacing
.Making the headers full-width might work by leaving them out of the table layout algorithm — leave ’em as
block
, and reorient where the cells start by abusingwriting-mode
. (I’ve done things I’m not proud of.)…but all that’s definitely deep in the weeds of hackiness. (And let’s not talk about
display:table-caption
, which hoists the child box out of the border-box of its parent.)If the CSS Table Layout specification had equivalents to
colspan
androwspan
, we would have been halfway to Grid in 2009. But I can’t blame them for underspecifying the weirdest, most browser-specific layout system ever accidented.Good idea, forgot about
display: table-row-group
, that does make the borders somewhat work again.But leaving the header and
.top
wrapper as a block doesn't fix thecolspan
problem, which is now manifesting in a really weird way... Without checking the spec, it feels like the children of atable-row-group
are in some sort of all-or-nothing pact, where if any one of them is givendisplay: table-row
(and has at least onetable-cell
child?), they all act liketable-row
s withtable-cell
children. But if none of them have a table display type, they act likeblock
s, even if one hastable-cell
children...table-row
: pen.counts
hastable-row
: penYeah, I have mixed feelings about CSS Tables. I almost think it's better that it was kept small and arguably incomplete; maybe its holes helped motivate CSS Grid? Maybe if it had been more complete, people would have continually pointed to tables whenever someone brought up Grid, the same way some currently point to
display: contents
when someone mentions subgrids. But on the other hand, if we're going to have a table layout system anyway, might as well make it fully functional. Maybe they could augment it now to complete the picture.By the way, thanks for the replies, it's been very interesting! I forget that CSS Tables are a thing, and they're worth remembering for those odd corner cases
Thanks for the write-up and for not flaming someone for mentioning CSS tables. Open inquiry has not been the norm and you're doing good work here.
Ken, thanks for giving a great and detailedwrite-up on the need for subgrid.
I've been frustrated by the lack of subgrid on grid frameworks for a while now.