Mobile first responsive – how to adapt

[schmidtb]

Hi There,

I'm building a custom theme and plan for my CSS to be based on "mobile first" responsive design principles.

What is the underlying methodology being used by the Genesis 2.0 responsive CSS?

Any comments on adapting the Genesis 2.0 style.css to this methodology would be very helpful.

I'm using a SASS based environment, so any additional comments in that regard would also be appreciated.

Thanks
Bradley

[David Chu]

Hi,
That very much depends. Any adaptations I would make would be no different from when not going "mobile first". I would just be starting from the bottom of the CSS, essentially, and moving upward, instead of starting at the full width media queries.

You may want to set different breakpoints, and of course you'd want to style HTML elements that you're adding that aren't in the CSS. But that's just normal responsive coding, and isn't "mobile first" per se.

I don't use SASS, so there may be special considerations for that. Maybe someone else will chime in who uses it. I could be wrong, but I think you'll have better results speaking with SASS hackers about that issue.

Good luck, Dave

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[schmidtb]

Hi David,

Thanks for the comments.

I've been doing exactly as you mentioned, basing the CSS on the Genesis style.css.

Was just wondering why the team have not gone the mobile first route considering the efficiency for mobile.

Thanks

Bradley

[Author]

Posts