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
Matt Beck
6,232 PointsWhy is the line keep breaking around 100px even though the flex-basis has been set to 0?
I've tried setting the flex-basis value to multiple values under 100px, but when I resize the browser, the line keeps breaking when the items reach 100px in width. Any reason why this may be the case?
2 Answers
Craig Watson
27,930 PointsHi,
Is there a chance the items have a child that is set to around 100px or the child has padding etc. This seems quite a quirky thing to be happening can you set up a workspace or pen on codepen to have a look at the code on and see it in action ?
Craig
Matt Beck
6,232 PointsCraig --
If you see at the end of Guil's tutorial (Smarter Layouts with flex-basis and flex @ 6:20), he sets the flex-basis to 0 by setting flex: 1;. I noticed when I mimicked the code in the workspace, the break was appearing to happen much sooner (around 100px) in my browser than it was in his.
At the end of the day it's just curiosity! :)
Matt Beck
6,232 PointsMatt Beck
6,232 Pointshttps://codepen.io/mbeck/pen/MyRzvv?editors=1100#
Craig Watson
27,930 PointsCraig Watson
27,930 PointsHi Matt,
One of the reasons it is breaking is that the items content is to large in comparison to the flex-basis declaration. If you edit your flex-basis to 200px you will see the items wrap before the content goes onto another line within the item.
Is there something in particular you would like this code to do that I can help with or are you having a bash around with flexbox and just getting to know the quirks ? :)
Craig