DHTML Window widget (v1.1)

[jrthor2]

1) Script Title: DHTML Window widget (v1.1)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...ndow/index.htm

3) Describe problem: Is there a way to make the CSS used for this script validate?

[Nile]

Can you please make your link valid so we can see what script your having you problems with?

[jrthor2]

sorry, the link must have changed. Here it is:

http://www.dynamicdrive.com/dynamici...dhtmlmodal.htm

[ddadmin]

The portions of the CSS that fail the validator I suspect are the lines dealing with opacity in IE, such as:

filter:progid:DXImageTransform.Microsoft.alpha(opacity=80);

in modal.css, and:

filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);

in dhtmlwindow.css. From W3C:

The CSS Validator validates your style sheet against some profile, e.g. CSS Level 1 or CSS Level 2. Some browser Vendors however extend these profiles by new properties like Microsoft did with the scrollbar-base-color or filter property or Mozilla with the -moz-opacity property. The Validator is not aware of these properties and using them makes your style sheet invalid in terms of the CSS specifications. Either get rid of those properties or live with the fact, that your style sheets don't validate. You cannot have both.

One thing you can do is remove the non standard lines in your CSS that concerns IE, and use conditional HTML to output them:

<!--[if ie]> 
<style type="text/css">

.drag-handle{
filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
}

#interVeil{
filter:progid:DXImageTransform.Microsoft.alpha(opacity=80);
}
</style> 
<![endif]-->

This should take care of IE, though there are also lines used in the CSS that are Firefox only, such as -moz-opacity: 1;, so you may need to deal with those some other way.

[jrthor2]

Ok, I took care of that, but the opacity attribute on the #interVeil class is invalid, and is required for mozilla to have the transparent look for the background.

[ddadmin]

You mean -moz-opacity right? Opacity itself is a valid CSS property.

[jrthor2]

I'm referring to opacity, which isn't validating on the W3C CSS Validator. Here is what the validator says:

319 #interVeil Property opacity doesn't exist in CSS level 2.1 but exists in [css3] : 0.7

[Nile]

Then validate it in css3.