Learn CSS Grid - A 13 Minute Deep Dive

🚨🚨🚨 COURSES - 🚨🚨🚨 Discord - Source code: Grids are two dimensional, I can place things on it horizontally, vertically and both simultaneously. Actually I can position items in any way I want, even stacked. Each number represents a line, these lines are row lines and these lines are column lines. Our grid is made up of cells, each square is a cell. And finally, our grid is also made up of tracks, these are the rows and these are the columns. 0:00 Intro 0:24 Creating a grid 0:45 grid-template-rows & columns 1:17 Positioning Items 1:48 grid-row & grid-column 2:10 span keyword 3:01 grid-area 3:29 Negative numbers 3:45 Layering items 4:32 grid-auto-rows 5:29 grid-auto-flow 5:40 grid-auto-column 5:51 Fractional units 6:43 minmax() 7:10 repeat() 7:39 grid-gap 7:53 grid-template-areas 9:55 justify-items & align-items 10:53 justify-self & align-self 11:20 justify-content & align-content 12:20 auto-fit
Back to Top