CSS Grid Changes Everything

; Date: Wed Aug 09 2017

Tags: Git

Getting web content to layout as you want usually results in messy HTML and messy CSS. Limitations of both usually means you're nesting DIV's to get a structure where you can use various arcane CSS paradigms like absolute or relative positioning. CSS Grids changes all that. You can use simple HTML markup accompanied by straight-forward CSS rules to lay it out. It's a breath of fresh air. It's supported in ALL the modern web browsers.

Why not flexbox? Isn't that the thing that's supposed to be our page layout savior? The problem with flexbox is it runs in only one direction. For more complex layouts you need to nest flex containers. CSS Grid is a two-dimensional layout system and can handle more complex layouts.

Traditional CSS methodology, as well as flexbox, works from the content outward. CSS Grid works from the layout inward.

About the Author(s)

(davidherron.com) David Herron : David Herron is a writer and software engineer focusing on the wise use of technology. He is especially interested in clean energy technologies like solar power, wind power, and electric cars. David worked for nearly 30 years in Silicon Valley on software ranging from electronic mail systems, to video streaming, to the Java programming language, and has published several books on Node.js programming and electric vehicles.