DEV Community


Posted on

Flexbox help!

Hello 👋
I've been learning Front-end Web Development for a couple of months now, and I have worked through a fair few different resources that cover CSS. I'm currently working through The Odin Project on the CSS Fundamentals and I'm really struggling to get my head around Flexbox.

In principle I understand what it does and can understand and use some of the really basic properties of it, but then it just gets a bit too much and everything starts to fall apart.

On TOP I've read through all the articles they provided and they make sense when reading but when it comes to applying it's a completely different story and I feel like I'm stuck and it's a little bit overwhelming as the next project is going to use a lot of Flexbox.

Has anyone else had difficulty with FB and can recommend any resources that helped, ideally video tutorials would be helpful, I've read a lot already. I feel silly because I can't say exactly which part of the process I don't understand, it's almost like I understand and then I don't.

Any help would be greatly appreciated!

Discussion (4)

glassjames profile image

Highly recommend flexbox froggy. It's a pretty simple game that walks you through the various flexbox-related CSS properties you can use:

m1keym profile image
Mikey Author

I've done that one before, it was super cool. That's how I got my head around justify-content/ align-items.

I think I've identified one of the parts is struggle with is flex grow/shrink/basis. I know what each one does but I don't understand when I would need to use them and they make my head hurt - amongst other things in Flexbox 😆

joelbonetr profile image
m1keym profile image
Mikey Author • Edited on

Thank you, I had a look but some of this is way past the level that I'm at right now!

I appreciate the suggestion though :)