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 Building a Layout with Flexbox Building a Navigation Bar with Flexbox

Jake Kobs
Jake Kobs
9,215 Points

Mobile first before implementing media queries?

I'm trying to create my own website with flexbox, but I'm a little confused on the mobile first concept. Am I supposed to format it to fit mobile screens before I start the media queries of min-width:769px and min-width:1025px?

Yes. Style it first at the smallest width then use min-width media queries to adjust the elements as needed. Your base rules should be for the smallest screen size. Hope this helps.

1 Answer

Brendon Butler
Brendon Butler
4,242 Points

I totally agree with the "mobile first" concept. Essentially what you're trying to do is create the most simple, appealing website you can on the smallest device. As the screens become larger, you can add or remove entire divs/blocks/etc, change styles, fonts, colors, etc. To match each device. Start simple, then add features for larger devices.