The Complete Frontend Development Course | 150 Hours | Zero to Advanced - Flexbox: The Missing Pieces | Advance Flexbox Properties Explained | Frontend Bootcamp Hindi | Ep.23

Starter Code: https://github.com/procodrr/frontend-bootcamp/tree/main/ep-23_flexbox-part-2/starter-code Final Code: https://github.com/procodrr/frontend-bootcamp/tree/main/ep-23_flexbox-part-2/final-code Bootcamp Repo: https://github.com/procodrr/frontend-bootcamp In this video I have explained some advanced properties of flexbox. We'll go more in depth inside flexbox and learn different properties like flex-basis, gap, order, flex shorthand, align-content, inline-flex, and behavior of margin auto with flexbox. After watching this and the previous video you will become master of flexbox. 📖 Chapters 00:00 - Introduction 02:00 - Download the Starter Files and Open with VS Code 02:53 - Quick Recap 05:45 - How to Give Equal Width to All the Elements inside Flex Container? 15:48 - What is the flex-basis Property and Difference Between Width and Flex-basis? 26:08 - What Should You Use: Flex-basis or Width? 32:45 - Understand Flex-wrap Property in Depth 37:00 - What is "gap" Property in Flexbox? 39:03 - Row-gap vs Column-gap in Flexbox 43:00 - "Can I user" Website to See What Properties are Supported Where! 46:00 - Can We Use Margin instead of Gap? 53:32 - Understand "margin: auto" Property in Flexbox 01:06:30 - Quick Recap 01:08:00 - More on Margin Property in CSS 01:16:20 - Understand Order Property in Flexbox 01:24:00 - What is "align-self" Property in Flexbox? 01:34:25 - Understand Shorthand Flex Property 01:43:10 - Understand "align-items: baseline" in Flexbox 01:45:55 - Understand "align-content" Property in Flexbox 02:00:18 - Understand "inline-flex" Property in CSS 02:06:10 - Use Case of "inline-flex" Property 02:10:50 - Next Video Topics 02:12:30 - Quick Assignment 02:15:30 - Conclusion If you have any doubt you can ask in comment section I will reply to each and every question or you can reach out to me directly on my social media handles mentioned below. Social Media 🌐 Linkedin: https://www.linkedin.com/in/anurag-singh-web-developer/ 🌐 Instagram: https://www.instagram.com/procodrr/ 🌐 Twitter: https://twitter.com/anuragsinghbam 🌐 Telegram: https://t.me/+bq8CBsPL3Wc1MjU1 🌐 Discord: https://discord.gg/dMe9mer9B3 🌐 Portfolio: https://anuragsinghbam.com/ Music by geoffharvey from Pixabay