Treehouse: Grow your CSS skills. Land your dream job.

Mobile Design

  • # March 6, 2013 at 12:55 pm

    I’m going to create my own simple website project because I want to learn how mobile design works. Was wondering if anyone can help me out real quick? When I create a site I put in all my css and name my css file main.css.

    Do I link it to my css but for media put screen?
    Then I have to create a new css file and call it mobile.css, then link it to that css and change media to handheld?

    When I create my main.css instead of using pixles I use percentages?

    # March 6, 2013 at 1:41 pm

    I would download something like [Ratchet]( “”) and look at what they use.

    # March 6, 2013 at 3:41 pm

    @johnjf are you interested in [Web or Native mobile apps](

    I know nothing little about Native apps!

    As for the Web apps, I’ve learned a lot about building mobile first responsive websites by looking at the [Andy Clarke’s 320andup boilerplate]( Following [writings of Luke Wroblewski]( and [Ethan Marcotte](

    # March 6, 2013 at 5:35 pm

    Web, I’m just trying to create a normal simple site that will be able to fit in any screen.

    # March 6, 2013 at 6:46 pm


    If you want to go mobile first you could do this:

    For desktop first the other way around of course.
    I personally prefer to put everything into one css file, especially for a small site.
    For the desktop view you will probably want to set the wrapper width in pixels, or a max width. For small screens I recommend 100%. Look into responsive grid systems to make your life easier.
    Oh – and the polyfill if you go mobile first: <>

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.