1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Opacity property throwing an error

Discussion in 'CSS' started by tintumon, Sep 11, 2010.

0
  1. #1
    When I try to validate my site's CSS, a CSS file that works in conjunction with some JavaScript files I use to randomly rotate and fade my top banner images in and out throws this error message: Property opacity doesn't exist in CSS level 2.1 but exists in : 1 1

    The validator throws twelve such error messages for twelve different lines of the CSS file, three of which are these:


    .slideshow-images-visible { opacity: 1;}
    .slideshow-images-prev { opacity: 0; }
    .slideshow-images-next { opacity: 0; }


    In case it matters, I'm using the strict docType declaration at the top of my header:


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">


    I'd like to continue using these files, and I also would like my CSS to validate. Can you tell me if there is a fix or work-around I can use?
     
    tintumon, Sep 11, 2010 IP
  2. CSM

    CSM Active Member

    Messages:
    1,047
    Likes Received:
    25
    Best Answers:
    0
    Trophy Points:
    55
    #2
    Opacity is a CSS3 property but the validator is not set up for that just yet.

    You could do one CSS file for CSS3 only and <link> to it. So your normal CSS could be valid.
     
    CSM, Sep 11, 2010 IP
  3. radiant_luv

    radiant_luv Peon

    Messages:
    1,327
    Likes Received:
    34
    Best Answers:
    1
    Trophy Points:
    0
    #3
    radiant_luv, Sep 11, 2010 IP
  4. Cash Nebula

    Cash Nebula Peon

    Messages:
    1,197
    Likes Received:
    67
    Best Answers:
    0
    Trophy Points:
    0
    #4
    You can also get around it with Javascript, but this is a perfect excuse for ignoring the validator.
     
    Cash Nebula, Sep 13, 2010 IP
  5. wd_2k6

    wd_2k6 Peon

    Messages:
    1,740
    Likes Received:
    54
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Seeing as you are only using opacity:1; and opacity:0; you could probably get away with using display:none; or visibility:hidden, although this might require a bit of additional tweaking if it causes other problems.

    Although as suggested I wouldn't worry about it.
     
    wd_2k6, Sep 15, 2010 IP