W3C CSS validation problem

Discussion in 'CSS' started by canalboatman, Jul 19, 2010.

  1. #1
    I have gone to some lengths to make my site compliant but have run into a problem with the css of my mobile.css stylesheet.

    The mark up in my header is:

    <!--[if !IE]>-->
    <link media="only screen and (max-device-width: 480px) and (min-device-width: 320px)" href="./css/mobile.css" type="text/css" rel="stylesheet" />
    <!--<![endif]-->

    The style sheet begins:

    @charset "UTF-8";
    /* CSS Document */
    /* Remove default margins and padding */
    div { margin:0; padding:0;}
    body {margin:0;padding:0;height:100%;}

    ....and so on.

    This is the response I get from the WC3 validator:

    unrecognized media only screen and (max-device-width: 480px) and (min-device-width: 320px)

    How do I get round this?

    All advice gratefully received.
     
    canalboatman, Jul 19, 2010 IP
  2. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #2
    Your conditional comment is written wrong. Remove the extra --> on line one and the extra <!-- on the last line.
     
    Last edited: Jul 19, 2010
    drhowarddrfine, Jul 19, 2010 IP
  3. canalboatman

    canalboatman Peon

    Messages:
    54
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Brilliant. Funny how when you're doing this you can overlook a code error that simple even after staring at it for too long.

    It now validates and I owe you a beer!

    Cheers,

    Dominic
     
    canalboatman, Jul 19, 2010 IP
  4. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #4
    No, no. The million dollars will be fine.
     
    drhowarddrfine, Jul 19, 2010 IP