CSS Grid, Tables are back! Chrome supports CSS Grid layouts

In a recent blog post from the developers over at Google, they announced “tables are back, be there and be square”. The post goes on to recall the usage of flexbox which has been used for some years as a replacement for table layouts. Tables had been a staple to any html website for many years before the introduction of responsive web design and the “div” tag.

As websites became responsive the need for table structured layout web design was no longer needed. Tables had limited ability to adapt to new dimensions. Many developers would hack styles to make tables act as a responsive layout, including Twitter’s bootstrap.

CSS Grid is now available in Chrome and we can now use display: grid; as a way to set the layout of a web page. The blog post goes on to say “CSS Grid has been in development, behind a flag in most browsers for over 5 years and extra time has been spent on interoperability to avoid a buggy launch like Flexbox had. So if you use Grid to implement your layout in Chrome, chances are you’ll get the same result in Firefox and Safari. At the time of writing, Microsoft’s Edge implementation of Grid is out of date (the same as was already present in IE11.) and the update is “under consideration”.”

The development of Grid is great news for old school developers who want to maintain some of the legacy of html history. It will be interesting to see if, at all, websites that take advantage of this technology. To read the original article click here.

 

keyboard_arrow_up