CSS Opacity

[dcv]

I have three div elements on a web page; all the same background-image. The first is set to 100% opacity, the second at 66%, the third at 33%.

This is the CSS I'm using:

.fullfade {
	opacity: 0.33;
	filter: alpha(opacity=33);	/* for IE */
}

I've tested my site in Safari, Firefox(Mac+Win), Opera(Mac+Win), Camino, Shiira, OmniWeb and IE6(Win) (had to put the second line in to get it working in IE )

I ran my CSS through a validator last night and it reported that 'opacity' wasn't valid CSS But it's in the W3C CSS3 recommendation.

It seems to work so perhaps I shouldn't worry too much but I'm curious as to why it says this isn't valid. Am I doing something wrong?

 

[justG]

I think you answered your own question. It may be valid CSS3, but since CSS3 isn't "in production" yet, I think that the validator checks against the CSS2 spec.

 

[dcv]

I think you answered your own question. It may be valid CSS3, but since CSS3 isn't "in production" yet, I think that the validator checks against the CSS2 spec.

Ahhh ok thanks, just wanted to check in case I was doing something stupid!

 

[LastLine]

Any chance you can link me to the site? I'm intrigued to see the effect this has

 

[tominated]

you can validate using css3. just make sure css3 is chosen in the advanced options

 

[dcv]

Any chance you can link me to the site? I'm intrigued to see the effect this has

Sorry it's only on my local machine at the moment!

The effect is basically this though - just 'faded'-looking images.


My first ever website and it looks bloody awful I have zero creativity

I'm not a web developer (^obviously!) but am an application developer. Decided to build this site from scratch (pure XHTML/CSS/Javascript) rather than using any of those wysiwyg "web" programs. It doesn't have to be done to any particular standards but I've tried to stick to XHTML 1.0 Strict - and *yay* it validates. Then tried to validate the CSS - everything's fine apart from that 'opacity' thing, which bothers me a little.

 

[dcv]

you can validate using css3. just make sure css3 is chosen in the advanced options

D'oh! Probably an option I failed to see last night then (I was very tired!)

Thanks, I'll give it another go later then...