working out with responsive version

Discussion in 'Web Design' started by opensource, Apr 13, 2014.

to remove all ads.
  1. opensource

    opensource New Member

    Messages:
    67
    Hi,
    I design a webpage that could able to view in mobile with a responsive version of my designed website.
    I was wondering, once you have this

    Code:
    @media screen and (min-width:400px) { css style...}
    
    One you viewed it in mobile that has 400 screen, it really be viewed as stated in style? No need some 3rd party jquerry or some js script that could able to detect some media screen size etc ?
    Is it ?
     
  2. chrishirst

    chrishirst Well-Known Member Staff Member

    Messages:
    2,611
  3. Phreaddee

    Phreaddee Super Moderator Staff Member

    Messages:
    1,978
    except a mobile device at 399px or smaller wont get any styles at all.

    personally I prefer to do mobile first styles
    then say
    @media all and (max-width:640px) {...css styles...}
    @media all and (max-width:960px) { ...css styles...}

    etc etc...

    no need for JS to know the device width

    just this...
    <meta name="viewport" content="width=device-width" />


    plus read the link chris posted.
     
  4. RDB

    RDB New Member

    Messages:
    82
  5. Epic New Media

    Epic New Media New Member

    Messages:
    7
    Always start with Mobile first if possible, this will ensure that you don't run into difficulties once you've built a stunning desktop site and try to bring it down to Mobile.
     
    Last edited: Apr 16, 2014
  6. goon70056

    goon70056 New Member

    Messages:
    3
    Most designers I know always start with mobile. However, I find it easier to start with desktop and work my way down. I tried one site starting with mobile first, and it was a disaster. LoL. :)
     
  7. krymson

    krymson Member

    Messages:
    338
    To each their own... I do it the same way, but I literally draw out desktop, tablet, and phone before i start any coding. But thats just the way I do it.
     

Share This Page