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
The Responsive Web Design Bootcamp
Sources: kevin powell
It gives you a deep understanding of CSS and responsive design while keeping you fully engaged along the way. You'll learn to build four different layouts: a blog, a landing pag...
17 hours 36 minutes 12 seconds
Create Animated Breaking News Graphics with HTML, CSS and JavaScript
Sources: zerotomastery.io
Master the creation of dynamic overlays and animations for streams, scoreboards, and TV graphics. Learn the principles of working with animation and web technol
2 hours 40 minutes 39 seconds
Learn CSS Today
Sources: webdevsimplified.com
Learn modern CSS features and advanced CSS concepts in less than a day with this highly focused project-based CSS course.
9 hours 31 minutes 49 seconds
10 Mega Responsive Websites with HTML, CSS, and JavaScript
Sources: udemy
Welcome to the brand new course where you can learn about how to create modern and beautiful design templates for your websites. If you want to build and customize your portfoli...
21 hours 54 minutes 19 seconds
Flexbox Simplified
Sources: kevin powell
Flexbox is a wonderful tool that opens up the world of responsive layouts, but it can be hard to predict exactly what's going to happen when we use it, and it's full of sometime...
4 hours 41 minutes 57 seconds