Well the table based layout does not work on mobile. The float, flex or grid based layouts do.

So we've come somewhere but there is further to go and maybe we didn't need to go in so many circles.

What's broken with table layouts on mobile? I just tested my code above on Safari on iOS 10 and it displayed as expected.

Here's the live HTML I uploaded for testing: http://momentstudio.co.nz/temp/test.html

This page we're on now also runs mostly on tables.

> What's broken with table layouts on mobile? I just tested my code above on Safari on iOS 10 and it displayed as expected.

Depends what you'd expect, I suppose. These days, I'd expect the columns to switch to a vertical stacking layout when viewed at a mobile width. I guess maybe it's not "broken", per se, but it's not responsive and certainly pretty limited in how it can be used.

What stops you from declaring

   table { display:block; }

etc. if you need to transform your table into vertical flow layout?

Or even...

.responsive { display: block }

@media(min-size: 768px) { . responsive { display: table }}

Go use tables, it's a free world. Col/Rowspans are there in the Grid specification, give the article a go linked by OP.

The only thing got wrong is that it took a bit long, but current CSS layout techniques are totally awesome today.

Tables were/are never wrong for displaying actual tabular content.