CSS GRID and WordPress
ABOUT ME
NYCFC Work
FC Harlem Work
Wordpress work - ArtsEverywhere
Wordpress work - fdr4freedoms
Bloc.io
Talk Structure
What do these 3 photos have in common
me IRL
1989 HTML
1995 HTML TABLES
1995 HTML TABLES JAVASCRIPT
1996 HTML TABLES JAVASCRIPT FLASH
1998 HTML TABLES JAVASCRIPT FLASH CSS
All the screens
Big Screen
Small screen
Hacking
“We should look for opportunities to be just a little lazy”
We took the lazy part too far…
The web is only 29 years old and we’ve had to design websites conforming to its limitations
We build layout frameworks & layout plugins & layout boilerplates to mask those limitations
CSS Grid does not hide this limitations CSS Grid gets rid of them
“This new CSS revolutionizes web page layout” Jen Simmons on CSS Grid – Generate Conf NYC, 2016
CSS Grid - How?
Basic Structure
A simple grid
A fixed cell
Repeating cells
Explicit vs Implicit
Responsiveness like a boss
Template areas
CSS Grid – How
March 8, 2017 - 0.32%
Three Weeks Later….
March 29, 2017 – 26%
Jen Simmons Tweet
October 17th 2017
October 20, 2017 – 69.53%
February 16, 2018 – 82.8%
April, 2018 – 84.2%
84.16% Today!
84.16% Today!
@supports
Where can I learn more
CSS Grid – 4 Demos!
Demo time! *fingers crossed
CSS Grid Layout Module Level 2 Coming soon!
Just a little reminder that it's about 100 times mire important what you build than how you build ir – Chris Coyier
THANK YOU!!! slides: noti.st/jupago