CSS Layout with Flexbox

Solve layout scenarios with flex.

1. What is the default value of the 'flex-direction' property in Flexbox?

row column row-reverse column-reverse

2. Which of the following CSS properties are applied to the flex container (not flex items)?

display flex-grow flex-direction justify-content

3. The 'justify-content' property aligns flex items along the cross axis.

True False

4. What CSS property is used to define an element as a flex container?

5. Which property controls the alignment of flex items along the cross axis?

align-items justify-content align-content flex-align

6. Which of the following are valid values for the 'justify-content' property?

flex-start baseline center space-between

7. Flex items are block-level elements by default.

True False

8. The 'flex' shorthand property combines three flex item properties. Name them in order (separated by spaces).

9. Which property determines how much a flex item can grow relative to other items when there is extra space in the container?

flex-grow flex-shrink flex-basis flex-wrap

10. Which of the following properties are applied to flex items (not the flex container)?

flex-direction flex-grow align-self justify-content

Answered 0 of 0 — 0 correct

Company