CSS Flexbox: The Most Detailed Tutorial with Real-World Examples!
Example Files: https://github.com/RoyChng/CSS-Flexbo...
Challenge Files: https://github.com/RoyChng/CSS-Flexbo...
🎥 Video Description:
CSS Flexbox is an incredibly useful tool when trying to create modern layouts for the web. In this video, I focus on all the essential concepts of CSS Flexbox: From the justify content & align items property, to using flex grow and flex shrink!
But just knowing what these properties do isn't enough to know when to apply them. This is why I have also included 3 real-world examples that we look at along the way, and which I highly encourage you to try out and experiment with as well!
If you want some extra practice with using CSS flexbox, which is definitely necessary if you're just starting out, I would highly suggest trying out the last two challenges as well. Even if you can't complete them, your skills will naturally improve, and you'll know where are your strengths & weaknesses.
⏰ Timestamps:
00:00 - Introduction
00:30 - Justify-content
04:32 - Align-items
09:30 - Nesting Flexboxes
10:20 - Flex-wrap
12:10 - Recap of Flexbox Basics
12:54 - Flex-grow
14:55 - Flex-shrink
15:50 - Flex-basis
20:44 - Flex shorthand
21:22 - Align-self
24:13 - Recap of Advanced Flexbox
24:50 - Extra challenges
![[Non English] 1.7 Khmer Language](https://images.videosashka.com/watch/1IHVRDyjUKs)
