Skip to content
0:00 / 0:00

#cssgrid#layoutland#jensimmons

Basics of CSS Grid: The Big Picture

Layout Land

75K subscribers • 3 videos on Hallway

YouTube
  • Recommended by 3 people: 3 in engineering communities.
  • Presented by Jen Simmons, designer and developer advocate
  • May be out of date. Uploaded 8 years ago, in an area where tools change fast.

Beginner. No background in the topic needed.

195K views8 years ago3 recommendations

Web developmentCSS and layout

Jen Simmons explains the core concepts of CSS Grid and how it differs from older layout methods like floats.

Jen describes the overall big picture of CSS Grid and what all these terms mean. How it's different than float-based frameworks and how we are going to apply Grid to specific containers on the page — while still using other layout methods on other containers of content. Links: • The official Grid level 1 specification: w3.org/TR/css-grid-1 • Draft of the Grid level 2 specification: drafts.csswg.org/css-grid-2 • For more on Implicit vs Explicit, watch the beginning of this video: youtube.com/watch?v=tFKrK4eAiUQ

Why it's here

3 people recommend this

What people say. Recommended as an insightful and clear introduction to CSS Grid by one of its creators.

u/Lncr1259in r/Frontend • Recommends

On “How to become a CSS positioning master???”

For flexbox I spent a good amount of time on Flexbox zombies. I don't think it's as well know as something like flexbox froggy or grid garden, but it's very helpful. It's a long game/tutorial, but it covers everything you'll want/need to know about flexbox. For grid I'd recommend any YouTube videos by Jen Simmons. They are long and not in a typical tutorial format but very insightful. I would start with the "Basiscs of CSS Grid" video. If that's not you style, Kevin Powell also has good content on grid. For positioning I started with the tutorial on the Web Dev Simplified channel.

u/6easonin r/Frontend • Recommends

On “How to become a CSS positioning master???”

i have been self learning for 3 months and honestly i tried flexbox froggy but things never clicked till i used flexbox zombies every thing clicked, the same company have a version for grid that also has good reviews but i never tested it because it costs money for grid i used jen simmons resources her videos

u/pookageGrizzled Veteran ✌️in r/Frontend • Recommends

On “Grid with values on nodes”

Bit too vague to be able to offer any advice here, I'm afraid - but here's a great wee series on CSS Grid by one of the people who actually created the spec.