Flex grow, shrink, basis | CSS Flexbox tutorial

The flex-grow, flex-shrink and flex-basis properties decide how the items grow and shrink with the width of the container.

Once you've learned CSS Flexbox, you'll wonder how you ever managed to build websites without it. It gives you all the tools you needed in order to properly arrange content inside flexible containers.

Given that all websites need to be flexible and responsive these days, Flexbox is a must-have skill for web developers.

💻 Check out Scrimba’s interactive learning platform:
🌲 Linktree:

🤑GET AN EXTRA 10% OFF SCRIMBA PRO SUBSCRIPTION
Follow this link to claim your discount (expires Dec 1 2023)

[cherie]

One of the best visualisations. People really shouldn't overcomplicate such a straightforward concept. Great video!

[person]

Seen other videos where its basically someone using as many big words as possible to explain such a simple concept. This right here is actually TEACHING vs flexing on viewers (no pun intended)

[jacksebbenunicyclist]

Dude, this was a life saver! First tutorial I've found that clearly explains it. THANK YOU

[definty]

Very rarely do I come across a CSS tutorial done better than Kyle or Kevin but your explanation make it much simpler than anyone else's I've seen so far!

[kopilkaiser]

Absolutely one of the best tutorial to cover properly and adequately this topic on yt.

[stellanwae]

Ah! I love Scrimba. Great video, you made it so simple!

[blacknwhite]

Thanks, really great and clear tutorial. Been a FE developer for many years, but never really took time to look into the details of flex grow and shrink. So now I know :)

[estherinyang]

Half way in and I'm you are amazing at how you explain things so easily. Not a CSS beginner but I still came for this and you made it all easy to grasp, Thank you.

[hjz]

Lmao I've been searching for tons of videos on basis and you discussed it in such a simplistic way. Thank you sir.

[mjylove]

you did really good job explaining the concept! thank you!

[robertsheppard]

I checked 5 articles all all articles made it too hard to understand. Hats off to you! Amazing Explanation.. Thanks

[talibalasrar]

best explanation in such a short time, my friend you are a hero.

[tomcat]

Thank you very much for the visualization. It really helped!

[venkateshchintapalli]

One of the great explaination. Thank you brother 👌👌

[Gorillawan]

Thanks for your lesson, this is the first explanation that help me understand the differernt between those elements.

[dhoneybeekingdom]

Fantastic! So easy to understand, thank you!

[umarmuzammil]

wow ...very explicit love these contents smoooth thanks a lot

[franciscosalazar]

Wow, I couldn't understand this, even when I read the docs it was so confusing, but you made it son easy to understand! Thanks so much!

[nadeemkh]

Finally, I was able to understand it. Thank you so much mate.

[Karthikng]

This is the best explanation on flex box.