Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS CSS Flexbox Layout Flexbox Properties Wrapping Flex Items

Posted by ammarkhan
.a{fill-rule:evenodd;}techdegree
ammarkhan
Front End Web Development Techdegree Student 21,661 Points

wrap isn't working

I am trying to make flex-wrap work but it doesn't seem to work. I have created codepen for it. https://codepen.io/codearts/pen/wEzpNW

1 Answer

Steven Ang
Steven Ang
41,751 Points
Steven Ang
Steven Ang
41,751 Points

You need to make your ul into a flex container as well. Then you target the ul and add flex-wrap then it will work. The reason behind this is because ul is only a flex item, not a flex container so the items inside the ul will not be affected by the flex-wrap from the container since the li are the grandchildren of the container.

.container ul {
  display: flex;
  flex-wrap: wrap;
}