CSS CSS Flexbox Layout Flexbox Properties Wrapping Items and Distributing Space

mike o'shea
mike o'shea
9,917 Points
Posted by mike o'shea
mike o'shea
9,917 Points

css flexbox layout:help needed to question 2.

my answer of flex-direction:column; does not work.

2 Answers

Adam Pengh
Adam Pengh
29,872 Points
Adam Pengh
Adam Pengh
29,872 Points

flex-direction: column would technically work, but for the challenge, they are looking for the flex items within the flex container to wrap. So you would use flex-wrap: wrap;

mike o'shea
mike o'shea
9,917 Points
mike o'shea
mike o'shea
9,917 Points

works,many thanks,still not sure why

Adam Pengh
Adam Pengh
29,872 Points
Adam Pengh
Adam Pengh
29,872 Points

The two css rules are very similar. The main difference is that flex-direction sets the layout for all flex items in a container. So if you have 4 flex items and use flex-direction: column; all of those items will be in a column regardless of screen size. Flex-wrap is usually used in conjunction with flex-direction: row; to allow items to wrap at smaller screen sizes.

Hope that helps. :)