css-layout-classes

Question 1

Why do two div elements “vertically stack” on one another by default?

Answer 1

Two div elements “vertically stack” on one another by default because they are block elements. Block elements take up the entire width of their containing element and force elements before them in the code, upwards and elements after them in the code, downwards.

Question 2

What is the default flex-direction of an element with display: flex?

Answer 2

The default flex-direction of an element with display: flex is row. When adding display: flex, that element takes on the property flex-direction: row by default and functions as if the flex-container was an inline-block element. This means that the flex-container will try to fit as many flex-items into that row as possible.