This w3schools example can't be validated with validator.w3.org/unicorn

[Hero]

Hi!

 

 

I tried using "Example 3 - Text in Transparent Box" here:

http://www.w3schools.com/css/css_image_transparency.asp

 

But it could not be validated.

 

My experiment can be found here:

http://www.transformation.dk/chemtrails/forsoge-lave-ramme3.html

 

This is the error I receive when I try to validate it with http://validator.w3.org/unicorn/ :

 

This document could not pass the test: W3C CSS Validator (Level 3)

Error (1)

Address: http://www.transformation.dk/chemtrails/forsoge-lave-ramme3.html

7 div.transbox Parse Error opacity=70)

 

I have also copied the original example into an individual page here:

http://www.transformation.dk/chemtrails/Opacity-experiment.html

That generates A LOT of errors, including the one mentioned above. So it is not my way of incorporating it in my page that creates the error.

 

 

Best regards,

H.R.

 

[dsonesuk]

It's because MS decided not to use what all other BETTER browsers use 'opacity:' which is w3c standard, but there own filter: alpha(), so because is not standard it will always give an invalid error.

The other errors relate to no title and no charset set in head which is required.

[dsonesuk]

If you want page to validate with IE non standard opacity code.

        <style type="text/css">            div.background            {                width: 500px;                height: 250px;                background: url('LastChance1_800x450.jpg') repeat;                border: 2px solid black;            }            div.transbox            {                width: 400px;                height: 180px;                margin: 30px 50px;                background-color: #ffffff;                border: 1px solid black;                opacity:0.6;            }            div.transbox p            {                margin: 30px 40px;                font-weight: bold;                color: #000000;            }        </style>        <!-- DUMP MS IE SPECIFIC NONE STANDARD C@#P HERE -->        <!--[if lte IE 8]>        <style type="text/css">div.transbox { filter:alpha(opacity=60); /* For IE8 and earlier */}</style><![endif]-->

[Hero]

Yes! Now it validates. Thank you.

[davej]

Why does the validator now seem to issue errors based on old levels? Doesn't the doctype tell it to test only against CSS3 ?

[dsonesuk]

CSS include of CCS2, and CSS3. CSS3 would be new CSS styling features for example border-radius, background-size:, and being able to use two image on background.

 

Doctype tells the validator what version xhtml/html version to test against, for example HTML5 allows anchors to be placed around div block containers whereas older doctypes wouldn't, HTML5 has new elements that are not allowed in older doctype versions.

[davej]

I guess I just don't remember seeing errors when I used CSS3 and the HTML5 doctype. Now there are errors listed because it fails CSS2.