Hola.
Quería aportar una pequeña idea con la cual solucionar los problemas de validación de la W3C con respecto al CSS3 Oficial y al exclusivo de los navegadores (-moz,-webkit, etc).
El caso es que si puedes validar el XHTML de Google +1 con CDATA usando Javascript, porque no vas a poder usar javascript y cdata para validar css3. Os pongo un ejemplo.
Esto, no os lo va a validar...
Código CSS:
Ver original.contenedor #menu ul li {
float: left;
width: 124px;
margin: 0px 1px 0px 1px;
padding: 4px 0px 6px 0px;
overflow: hidden;
cursor: pointer;
border: 1px solid #555;
background-color: #CECD00;
/**************** CSS 3 JS *****************/
-moz-border-radius: 15px 15px 0px 0px;
-webkit-border-radius: 15px 15px 0px 0px;
border-radius: 15px 15px 0px 0px;
}
.contenedor #menu ul li:hover {
background-color: #ABAA00;
/**************** CSS 3 *****************/
-moz-box-shadow: 0px -1px 10px #CECD00;
-webkit-box-shadow: 0px -1px 10px #CECD00;
box-shadow: 0px -1px 10px #CECD00;
}
Pero sin embargo, si hacemos lo siguiente...
Código Javascript
:
Ver original<script language='javascript' type='text/javascript'>
//<![CDATA[
document.write("<style type='text/css'>");
document.write(".contenedor #menu ul li {-moz-border-radius: 15px 15px 0px 0px; -webkit-border-radius: 15px 15px 0px 0px; border-radius: 15px 15px 0px 0px;}");
document.write(".contenedor #menu ul li:hover {-moz-box-shadow: 0px -1px 10px #CECD00; -webkit-box-shadow: 0px -1px 10px #CECD00; box-shadow: 0px -1px 10px #CECD00;}");
document.write("</style>");
//]]>
</script>
Y ya de aquí lo podemos sacar a un js externo y meter ahí nuestros codigos css3.
Un saludo!
Un ejemplo de ello... tecba.es