treehouse : what would you like to learn today?
Web Design Web Development iOS Development

[Solved] @media css property

  • Hi Guys,

    I have created a responsive website using @media css property, my question is will this property work on window mobile phones?

    http://www.mazharkhan.com/projects/mtf/index.html

    Thanks

  • @mazhar19 : I dont have a windows phone to test but i just read an article and apparently (article dated 2011) it says pure media queries dont really show well, however, adding something like this would work.

    <link rel="stylesheet" href="/css/global.css" media="all">
    <link rel="stylesheet" href="/css/layout.css" media="all and (min-width: 30em)">
    <!--[if (lt IE 9)&(!IEMobile)]>
    <link rel="stylesheet" href="/css/layout.css" media="all">
    <![endif]-->

    I never like doing this due to extra http requests but here is the article and i will try and do some more reading on this. I never really thought about this until seeing your post.

    Article

  • @ JohnMotylJr

    Thank you so much :) i really appreciate it.

  • @ JohnMotylJr

    I have added [media="all"] to my css links

    can you help me how u put this below line ? bcoz when i put like this its appearing on my webpage as it is.

    [if (lt IE 9)&(!IEMobile)]> <![endif]

  • @mazhar19

    You need to start the statement like you would with a comment, such as;

        <!--[if (lt IE 9)&(!IEMobile)]> <![endif]-->
    
  • Thank you Watson :)