Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS CSS Flexbox Layout Flexbox Properties Wrapping Flex Items

Yifang kuo
seal-mask
.a{fill-rule:evenodd;}techdegree
Yifang kuo
Front End Web Development Techdegree Student 12,376 Points

why i can't wrap my item?

when my height is 100px, my flex-wrap doesn't work. but after i follow the video change to 280px, my item can stay inside the container. I want to know why is that?

here is my code

.container {
  height:100px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  flex-wrap:wrap;
  flex-direction:column;
}

1 Answer

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 90,797 Points

How big is the content inside your element?

It might be a case of too much content for flexbox to manage on element of the smaller height. Otherwise the content will overflow out of its container.