background-size:cover

Jessi11 · #1 (**permalink**) 16/01/2011, 02:46

Buenas, a la hora de validar mi página web en http://jigsaw.w3.org/css-validator/ y me dice que tengo el siguiente error:

Me dice que el error se encuentra en la línea 11, lo busque y es esto:

Código:

background-size:cover

Bueno, mi preguta es : hay alguna forma de cambiar la etiqueta "background-size:cover" por otra pero sin que se modifique en nada el aspecto de mi sitio web y que sea valido en Css 2.1?

Muchas Gracias!

sanxuan · #2 (**permalink**) 16/01/2011, 07:15

La respuesta es que no. Es una propiedad que no estaba contemplada en CSS 2.1.
Hacer algo parecido obligaría a modificar el código HTML.
La imagen debería aparecer en una etiqueta <img> en lugar de en el CSS y habría que escalarla con porcentajes para ocupar la totalidad del contenedor.

sanxuan · #3 (**permalink**) 16/01/2011, 07:25

Podría ser algo así:

CSS:
#fondo{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}
#fondo img{
width:100%;
height:auto;
}
#contenido{
position:absolute;
top:0;
left:0;

}

HTML:
<body>
<div id="fondo"><img src="miImagenDeFondo.jpg"/></div>
<div id="contenido"> ... mi contenido... </div>
</body>

Jessi11 · #4 (**permalink**) 16/01/2011, 14:30

Probe validarlo en CSS 3 y me aparece que esta todo el código correcto jeje así que creo que lo voy a dejar así.

Gracias por tu respuesta sanxuan.