The CSS FLEXBOX System

[@SaidSquirrel]

This was super helfpul as a beginner, especially the explaination using terms understood by everyday people. Love how you went through it with both the code and visual examples. Hope you make more of these, especially for Grid and how the two can work together.😎👍

[@andymc5955]

Phenomenal explanation, thank you.

[@Debrugger]

Nice explanation! One thing: those bubble sounds are wayy too loud, almost painful through my speakers

[@chunkydotdev]

Thank you! Great feedback, i'll make sure to work on the sounds :)

[@lilcranky9455]

Perfect Video! thx!

[@chunkydotdev]

Thank you! 🙏

[@janosjanosi1148]

Thank you!

[@sfabian]

Great explanation! ❤

[@SpaceGeneralX]

Flex vs Grids - in what situations will flex be the better option?

[@chunkydotdev]

Good question! I really like using flex for very straight forward lists and simple grids where wrapping the flex items into new rows is sufficient. I mostly use grids when i want to have more specific rules on for example responsive behaviour or like if the grid items should have different amounts of width but still be aligned in both columns and rows. Page layouts are usually an example of where i like to use grid to set a nice base structure and then I usually flex inside the grid items to set up the items in there.

[@afriend8961]

Does adding content to your divs (text, images, links, etc) result in the content exceeding the size of the divs, or becoming non-visible in the divs, and is this fixed with flexbox or width/height values in the divs, if so? =).

[@chunkydotdev]

Great question! You can let flexbox wrap the content in a flex-container with flex-wrap: wrap; and you'll have images links and text that would otherwise overflow the div on a new line instead.

[@afriend8961]

@@chunkydotdevThanks! I'm familiar with those properties. My pet peeve still is always encountering content that over laps or automatically extends a container and rendering the content invisible or partially visible. Is flexbox designed for fixing this only with it's properties, or do I have to fix it with other size properties? I'm fairly new to this! I seem to like grid more! Thanks! =).