Erros en validador CSS

[ceaped]

Buenas tardes para todos
Utilizo "colorbox" para una serie de imagenes pero tengo problemas en el validador CSS:

.cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight

Tentativa de encontrar un punto y coma antes del nombre de la propiedad. Añádalo

.cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight

La propiedad progid no existe : DXImageTransform DXImageTransform

.cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight

Error de análisis sintáctico DXImageTransform.Microsoft.gradient(startColorstr= #00FFFFFF,endColorstr=#00FFFFFF);

.cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight

Error de análisis sintáctico }

.cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight

Error de análisis sintáctico this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoade r(src=" + this.src + ", sizingMethod='scale')")

Gracias por su ayuda

[alexg88]

Pon el código CSS entero para poder ver los errores, pero seguramente es que estás utilizando propiedades no válidas en CSS.

[ceaped]

Hola alexg88, gracias por tu ayuda.
El CSS es de la galería "Colorbox".

/*
ColorBox estilo de la base:
El siguiente CSS es consistente entre los temas de ejemplo y no debe ser alterado.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

/*
Usuario Estilo:
Cambiar los estilos siguientes para modificar la apariencia de ColorBox. Ellos son
ordenado y con fichas de una forma que representa la anidación del HTML generado.
*/
#cboxOverlay{background:url(images/overlay.png) repeat 0 0;}
#colorbox{}
#cboxTopLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -100px 0;}
#cboxTopRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -129px 0;}
#cboxBottomLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -100px -29px;}
#cboxBottomRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -129px -29px;}
#cboxMiddleLeft{width:21px; background:url(images/controls.png) left top repeat-y;}
#cboxMiddleRight{width:21px; background:url(images/controls.png) right top repeat-y;}
#cboxTopCenter{height:21px; background:url(images/border.png) 0 0 repeat-x;}
#cboxBottomCenter{height:21px; background:url(images/border.png) 0 -29px repeat-x;}
#cboxContent{background:#fff; overflow:hidden;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxLoadedContent{margin-bottom:28px;}
#cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
#cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
#cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
#cboxPrevious{position:absolute; bottom:0; left:0; background:url(images/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
#cboxPrevious.hover{background-position:-75px -25px;}
#cboxNext{position:absolute; bottom:0; left:27px; background:url(images/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
#cboxNext.hover{background-position:-50px -25px;}
#cboxLoadingOverlay{background:url(images/loading_background.png) no-repeat center center;}
#cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}
#cboxClose{position:absolute; bottom:0; right:0; background:url(images/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
#cboxClose.hover{background-position:-25px -25px;}

/*
El siguiente se corrige un problema en Internet Explorer 7 + reemplaza una transparencia de PNG alfa con un negro relleno cuando un alfa del filtro (cambiar la opacidad) se establece en el elemento o elemento de los antepasados.
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
filter: progid:DXImageTransform.Microsoft.gradient(startCo lorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}

/*
A continuación se proporciona apoyo a la transparencia PNG para IE6
*/
.cboxIE6 #cboxTopLeft{background:url(images/ie6/borderTopLeft.png);}
.cboxIE6 #cboxTopCenter{background:url(images/ie6/borderTopCenter.png);}
.cboxIE6 #cboxTopRight{background:url(images/ie6/borderTopRight.png);}
.cboxIE6 #cboxBottomLeft{background:url(images/ie6/borderBottomLeft.png);}
.cboxIE6 #cboxBottomCenter{background:url(images/ie6/borderBottomCenter.png);}
.cboxIE6 #cboxBottomRight{background:url(images/ie6/borderBottomRight.png);}
.cboxIE6 #cboxMiddleLeft{background:url(images/ie6/borderMiddleLeft.png);}
.cboxIE6 #cboxMiddleRight{background:url(images/ie6/borderMiddleRight.png);}

.cboxIE6 #cboxTopLeft,
.cboxIE6 #cboxTopCenter,
.cboxIE6 #cboxTopRight,
.cboxIE6 #cboxBottomLeft,
.cboxIE6 #cboxBottomCenter,
.cboxIE6 #cboxBottomRight,
.cboxIE6 #cboxMiddleLeft,
.cboxIE6 #cboxMiddleRight {
_behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoade r(src=" + this.src + ", sizingMethod='scale')");
}

Gracias por tu ayuda

[ArturoGallegos]

no era necesario ver tu codigo CSS para responder desde los errores que has mostrado es mas que evidente tu css presenta un error por propiedades que no pertenecen al CSS

en concreto

Código CSS:

.cboxIE6 #cboxMiddleRight {
_behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoade r(src=" + this.src + ", sizingMethod='scale')");
}
 

bajo ninguna circunstancia va a validar si mantienes ese codigo... te sugiero lo coloques en un archivo aparte y solo lo mandes a llamar cuando se visite el sitio con IE

[ceaped]

Hola Ag666, gracias por tu respuesta.
Bueno subí todo el estilo porque alexg88 pidio que subiera todo, pero bueno.
Lo que tu me dices es que cree un estilo sólo con ese CSS?, lo llamaría normalmente como hace uno para ponerlo en el html...o como dices que debo ponerlo.

Gracias por tu ayuda

[kseso?]

En caso de ser utilizada en múltiples html, en una segunda hoja de estilos y llamada mediante comentario condicional.
Si solo se emplea en un archivo, en e head del mismo, en un <style tipe="...> distinto dentro del comentario condicional.

[juanrodriguez_arg1]

Ceaped estos errores que mostrás en la hoja de estilos son propiedades que exclusivas de ciertos navegadores, en este caso IE.
Esto no afecta a la visualización de tu sitio en múltiples navegadores ya que solo el navegador en cuestión comprenderá para qué sirve. El resto solo pasará por alto esa línea.
De todos modos podés probar ir eliminando esas líneas que impiden tu validación e ir testeando paso a paso los cambios en los navegadores, principalmente en IE.
En mi experiencia la gran mayoría de plugins de javascript utilizan algunas propiedades CSS no válidas pero aún así se ven bien.
También está la opción de usar condicionales para leer la hoja de estilos como te sugirieron.

[fres]

Buenos días,

Tengo varios errores al validar mi web y no consigo corregirlos... me gustaría que pudierán ayudar.

Les dejo el codigo css

<style type="text/css">

body {
margin: 0px;

}
.pie {
font-family: "Century Gothic";
font-size: 12px;
font-style: normal;
font-weight: bold;
color: #FFFFFF;
}
.imagen_negra_lateral {
background-image: url(imagenes/prolong.jpg);
background-repeat: repeat-x;
}

.pie {
font-family: "Century Gothic";
font-size: 12px;
font-style: normal;
font-weight: bold;
color: #FFFFFF;
}

.Estilo1 {
font-size: 16px;
color: #FFFFFF;
}


.borde {
border-bottom-color: #3f474a;
border-bottom-width: thin;
border-bottom-style: solid;
}



.texto .texto .titulo_diseño_web {
font-family: "Century Gothic";
font-size: 18px;
font-weight: bold;
color: #0033FF;
}

.borde {
border-bottom-color: #3f474a;
border-bottom-width: thin;
border-bottom-style: solid;
}
.texto_pie {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: bold;
color: #990066;
}
.piee {
font-family: "Century Gothic";
font-size: 12px;
font-style: normal;
font-weight: bold;
color: #FFFFFF;
}


.titulo {
font-family: "Century Gothic";
font-weight: bold;
color: #faa123;
font-size: 18px;
}
.texto {
font-family: "Century Gothic";
font-size: 13px;
font-weight: normal;
color: #026083;
}
.imagen_negra_lateral {
background-image: url(imagenes/prolong.jpg);
background-repeat: repeat-x;
}
.imagen_centro_pie {
background-image: url(imagenes/footer.jpg);
background-repeat: repeat-x;
}
.texto_trabajos2 {
font-size: 14px;
font-weight: bold;
color: #003366;
font-family: "Century Gothic";
}

.Estilo3 {color: #FF0000}

.Estilo2 {font-size: 16px}

.servicios {
font-family: "Century Gothic";
font-size: 12px;
font-weight: normal;
color: #999999;
}
.Estilo1 {
font-size: 16px;
color: #FFFFFF;
}

.texto_paquetes {
font-family: "Century Gothic";
font-size: 14px;
font-weight: bold;
color: #FF0000;
}
.texo_diseño_web {
font-family: "Century Gothic";
font-size: 18px;
font-weight: bold;
color: #FFFFFF;
}
.texto_poblacion {
font-family: "Century Gothic";
font-size: 18px;
font-weight: bold;
color: #F00;
}

.texto_violeta {
font-family: "Century Gothic";
font-size: 13px;
font-weight: normal;
color: #9e20a8;
}
.titulo_trabajos_web {
font-family: "Century Gothic";
font-size: 14px;
font-weight: normal;
color: #FF6600;
}
.titulo_texto_cabecera {
font-family: "Century Gothic";
font-size: 18px;
font-weight: bold;
color: #0F0;
}
.titulo_texto_violeta {
font-family: "Century Gothic";
font-size: 18px;
font-weight: bold;
color: #606;
}


.texto_trabajos {
font-family: "Century Gothic";
font-size: 13px;
font-style: normal;
font-weight: lighter;
color: #000066;
}
.titulo_contacte_con_nosotros {
font-family: "Century Gothic";
font-size: 10px;
font-style: normal;
font-weight: normal;
color: #FF3300;
}
.texto_blanco {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: normal;
color: #FFFFFF;
}
a {
color: #F00;
text-decoration: none;
font-size: 13px;
font-weight: normal;
}
.texto_blanco {
font-family: "Century Gothic";
font-size: 13px;
font-weight: normal;
color: #FFF;
}


.barra_naranja {
background-image: url(imagenes/barrita_naranja.png);
background-repeat: repeat-x;
}
.texto_naranja {
font-family: "Century Gothic";
font-size: 12px;
font-weight: normal;
color: #C90;
}
.texto_negrito {
font-family: "Century Gothic";
font-size: 12px;
font-weight: normal;
color: #333;
}
.texto_servicios {
font-family: "Century Gothic";
font-size: 18px;
font-weight: bold;
color: #00F;
}
texto_titulo_violeta {
font-family: "Century Gothic";
font-size: 18px;
font-weight: normal;
color: #609;
}
.TEXTO_TITULO_ROJO {
font-family: "Century Gothic";
font-size: 18px;
color: #F00;
}
.titulo_texto_azul {
font-family: "Century Gothic";
font-size: 18px;
font-weight: bold;
color: #03C;
}

.texto_azul_cielo {
font-family: "Century Gothic";
font-size: 18px;
font-weight: bold;
color: #6fa8c5;
}
.texto_azul_cielo_peke {
font-family: "Century Gothic";
font-size: 14px;
font-weight: bold;
color: #6fa8c5;
}
.texto_violeta_peke {
font-family: "Century Gothic";
font-size: 14px;
font-weight: bold;
color: #5e0556;
}
.texto_naranja_peke {
font-family: "Century Gothic";
font-size: 14px;
font-weight: bold;
color: #0F0;
}
.texto_naranja {
font-family: "Century Gothic";
font-size: 18px;
font-weight: bold;
color: #ff6700;
}
.texto_naranja_peke {
font-family: "Century Gothic";
font-size: 14px;
font-weight: bold;
color: #ff6700;
}
.texto_rojo {
font-family: "Century Gothic";
font-size: 14px;
font-weight: bold;
color: #F00;
}
.imagen_pie {
background-image: url(imagenes/imagenes%20de%20titulos/bg_box_bottomLnks.gif);
}

.texto_azul {
font-family: "Century Gothic";
font-size: 14px;
font-weight: bold;
color: #03C;
}
.Encabezado_diseno_creativo {
font-family: "Century Gothic";
font-size: 18px;
font-weight: bold;
color: #34ccfd;
}
.lateral_informatica_integral {
background-image: url(imagenes/imagenes%20de%20titulos/lateral_izquiedo%20de%20informatica%20integral.png );
background-repeat: repeat-y;
}
.lateral_derecho_informatica_integral {
background-image: url(imagenes/imagenes%20de%20titulos/lateral_derecho%20de%20informatica%20integral.png) ;
background-repeat: repeat-y;
}
.wrapper{
-webkit-box-shadow: 1px 0px 19px rgba(50, 50, 50, 1);
-moz-box-shadow: 1px 0px 19px rgba(50, 50, 50, 1);
box-shadow: 1px 0px 19px rgba(50, 50, 50, 1);
}
.Marco_trabajos {
background-image: url(imagenes/marco_trabajos.jpg);
background-repeat: no-repeat;
}
.marco_portafolio {
background-image: url(imagenes/marco_productos.jpg);
background-repeat: no-repeat;
}
.texto_negrita_promociones {
font-family: "Century Gothic";
font-size: 14px;
font-weight: bold;
color: #37A3E4;
}
.linea_puntos {
background-image: url(imagenes/imagenes%20de%20titulos/punto.jpg);
background-repeat: repeat-x;
}
.certificado_ssl {
background-image: url(imagenes/imagenes%20de%20titulos/body%20CERTIFICADOS%20SSL.png);
background-repeat: no-repeat;
}
.pagina_web_basica {
background-image: url(imagenes/imagenes%20de%20titulos/body%20promociones.png);
background-repeat: no-repeat;
}
.Body_posicionamiento {
background-image: url(imagenes/imagenes%20de%20titulos/body%20posicionamiento.png);
background-repeat: no-repeat;
}
.Texto_titulos_nueva_imagen {
font-family: "Century Gothic";
font-size: 24px;
font-weight: bold;
color: #f06e0c;
}
.body_comercio_electronico {
background-image: url(imagenes/imagenes%20de%20titulos/body%20comercio%20electronico.png);
background-repeat: no-repeat;
}
</style>

y estos son los erroes....

1 Error sintáctica. Hoja de estilo ne pueden incluir fragmentos de HTML. <style type="text/css">
341 Error de análisis sintáctico </style>

Advertencias:

297 can't find the warning message for vendor-extension
298 can't find the warning message for vendor-extension

Dejo mi dirección web por si es necesario visitarla:

http://xn--estiloydiseo-khb.com/index.html

Espero me ayuden a solucionarlo.


Muchas gracias de ante mano

[pzin]

fres en vez de revivir temas viejos, tendrías que abrir un tema nuevo. Y tampoco está de más que uses highlight o code a la hora de postear código.

El primer y segundo error, es porque por lo visto usas ese código en tu hoja de estilos. Elimina <style type="text/css"> y </style> de tu archivo .css.

Los últimos dos errores, no debes de preocuparte por ellos. Eso es porque estás usando prefijos propietarios como -webkit, -moz, -o u otros que la W3C no reconoce. Pero no tienes que tener en cuenta esos errores.

[fres]

Muchas gracias,

Tomare nota de lo que me dices la próxima vez!