Topics - Video Tutorials & Practice Problems

<v ->In lesson than 11, we bring you a new type of box.</v> As you might guess from the name CSS Flexbox is a flexible box model for laying out content on the web, Flexbox allows you to more finely control how child elements fill space inside of a container while also still being able to adapt to the content inside. For example, suppose we have a container with three columns each with a different amount of content but we want all the columns to be the same height as the longest one, back in the days before Flexbox this was surprisingly hard to do and required things like using JavaScript to check the height of elements every time the window changed size or you'd need to use HTML tables for layout which you should never do unless you happen to fall asleep and wake up in 1998 and CSS hasn't yet been finalized. Now that we have Flexbox though, this type of problem has an easy solution. While also take an opportunity in this lesson to give some additional design attention to other parts of the homepage, as well as look at how to apply more advanced Flexbox features to create a three column layout for the gallery that we introduced in the previous lesson.