CSS Layouts with Flexbox & Grid (free full course)

💥 Want to learn how to build a website from scratch? Check out my course: https://coder-coder.com/responsive Source Code: https://github.com/thecodercoder/css-layout ____________ 💻 LEARN TO CODE 💻 MY COURSE: 🟢 Responsive Design for Beginners -- Learn how to build a website from scratch -- https://coder-coder.com/responsive RECOMMENDED RESOURCES: Tools and resources I use myself and highly recommend, with exclusive discounts (affiliate links help support this channel-- thank you!) 🔷 Frontend Mentor Pro -- Practice building real-world projects (20% off 1-yr with code JESSCHAN20) -- https://www.frontendmentor.io/?via=jesschan 🔷 Boot.dev -- Learn back-end development (25% off) -- https://www.boot.dev/?promo=CODERCODER OTHER STUFF: 🟢 Coder Coder Dark -- My VS Code theme -- https://marketplace.visualstudio.com/items?itemName=CoderCoder.codercoder-dark-theme 🟢 Coder Coder Merch -- get my hoodie, coffee cup, and more! -- https://coder-coder.com/merch SOCIALS: https://twitter.com/thecodercoder https://www.instagram.com/thecodercoder _____________ 0:00 - Intro 0:00:57 - Box Model 0:22:27 - Margin Collapse 0:31:54 - Display Property 0:47:18 - Position Property 1:09:54 - Flexbox 1:39:38 - Grid 2:13:19 - Stacked Grid 2:15:30 - Media Queries 2:28:25 - Bento Grid 2:35:22 - Dynamic Grid 2:44:01 - Practice: Nav Bar 3:02:49 - Practice: Tag Cloud 3:09:45 - Practice: Bento Grid #css #javascript #html