Mastering CSS Layout
1h 27m 20s
English
Paid
Course description
Learn the Best Practices and Design Patterns behind every CSS layout. Know exactly what you should and shouldn't do at all times. And develop the intuition to break every layout into its simplest building blocks and the ability to recreate it with both CSS Grid and Flexbox.
Watch Online
0:00
/ #1: Mastering CSS Layout Welcome
All Course Lessons (26)
| # | Lesson Title | Duration | Access |
|---|---|---|---|
| 1 | Mastering CSS Layout Welcome Demo | 02:40 | |
| 2 | Introduction to Design Patterns | 02:33 | |
| 3 | The Stack Design Pattern | 03:01 | |
| 4 | The Inline-Cluster Design Pattern | 01:29 | |
| 5 | The Split Design Pattern | 01:17 | |
| 6 | The Cover Design Pattern | 01:33 | |
| 7 | The Center Design Pattern | 02:27 | |
| 8 | The Column-Drop Design Pattern | 01:45 | |
| 9 | The Grid Design Pattern | 02:00 | |
| 10 | Introduction to Application | 06:08 | |
| 11 | The Stack Design Pattern in CSS Grid | 04:27 | |
| 12 | The Inline-Cluster Design Pattern in CSS Grid | 06:15 | |
| 13 | The Split Design Pattern in CSS Grid | 03:20 | |
| 14 | The Cover Design Pattern in CSS Grid | 03:27 | |
| 15 | The Center Design Pattern in CSS Grid | 03:33 | |
| 16 | The Grid Design Pattern in CSS Grid | 05:28 | |
| 17 | The Stack Design Pattern in Flexbox | 01:48 | |
| 18 | The Inline-Cluster Design Pattern in Flexbox | 04:14 | |
| 19 | The Split Design Pattern in Flexbox | 04:43 | |
| 20 | The Responsive Split Design Pattern in Flexbox | 10:14 | |
| 21 | The Cover Design Pattern in Flexbox | 02:58 | |
| 22 | The Center Design Pattern in Flexbox | 01:48 | |
| 23 | The Column Drop Design Pattern in Flexbox | 05:04 | |
| 24 | CSS Grid vs CSS Flexbox | 01:51 | |
| 25 | Other Layout Techniques | 01:33 | |
| 26 | You're done! | 01:44 |
Unlock unlimited learning
Get instant access to all 25 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.
Learn more about subscriptionComments
0 commentsWant to join the conversation?
Sign in to commentSimilar courses
Tailwind UI (Application UI + Marketing)
Sources: adamwathan
Tailwind UI is a collection of professionally designed, pre-built, fully responsive HTML snippets you can drop into your Tailwind projects. Get started by check
Modern HTML & CSS From The Beginning Course
Sources: Brad Traversy
This course is suitable for beginners who want to learn HTML and CSS from scratch to an advanced level, as well as for developers who want to implement...
24 hours 21 minutes 52 seconds
Build a Podcast Player with JavaScript, CSS and Node.js
Sources: zerotomastery.io
Learn to create a full-stack podcast player using JavaScript, CSS, and Node.js. Develop skills in web development and add a project to your portfolio.
8 hours 30 minutes 51 seconds
Web Developer Bootcamp with Flask and Python in 2022
Sources: udemy
Welcome to the Web Developer Bootcamp with Flask and Python! In this course, you'll learn how to build and deploy dynamic websites using Python, Flask, MongoDB,
19 hours 57 minutes 43 seconds
Advanced CSS & JavaScript Projects
Sources: zerotomastery.io
Master CSS and JavaScript by creating real projects! Develop applications like a quiz, an expense tracker, and a podcast player. You will learn...
15 hours 24 minutes 29 seconds