Kdb13: Assessment wanted for Flex layout skill test

Codepen links

Here’s the Assessment page

Hi @kdb13

The first three tasks are perfect! :medal_sports:

To make the task 4 look like the image you should change flex: 1; to flex: auto; on the children.
From flex | MDN:


The item is sized according to its width and height properties, but grows to absorb any extra free space in the flex container, and shrinks to its minimum size to fit the container. This is equivalent to setting " flex: 1 1 auto ".

This change also makes align-items: flex-start; on the parent obsolete. That line can now be deleted.

Have a nice day!

1 Like

Thanks, @mikoMK. I was wondering why weren’t the list items taking up the full width. Now, it works as expected!

1 Like