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

Posted by Tracy Excell
.a{fill-rule:evenodd;}techdegree seal-36
Tracy Excell
Front End Web Development Techdegree Graduate 15,333 Points

Are there better break points to use in this media query?

Are there better break points to use in this media query? My flexbox columns are collapsing in the larger screen size if it is not exactly on the screen size stated? Are there more flexible media queries that will help my columns expand? This is for a treehouse assignment so I can not post all of my code, however the large screen size needs to be at 1025px. I am having a similar experience with my tablet size, but it is not as bad. Thank you for your help.

/* large sized screen*/

@media screen and (min-width: 1025px) {

columns {

-webkit-column-count: 3; /* Chrome, Safari, Opera */
-moz-column-count: 3; /* Firefox */
column-count: 3;

}

1 Answer

Steven Parker
Steven Parker
243,331 Points
Steven Parker
Steven Parker
243,331 Points

:point_right: FYI: column-count is not a flexbox property.

If your unposted code is using flexbox, this may not be the property you want to change. Just a guess, but perhaps you want flex-basis?

Your media query should apply to any window with a width of 1025 pixels or more. I don't know what the assigment specifies, but generally you want your breakpoints near but not exactly at device sizes.

I'd need to see the other code to be more specific.