Hola a todos, estoy diseñando una web en la que las imágenes de fondo ocupan toda la pantalla. En principio todo funciona perfectamente en IE, Chorme y Firefox usando la propiedad de CSS background-size. El problema surge cuando intento ver la página en un iPad o iPod que llevan IOS 7.
He buscado bastante por Internet y según muchos usuarios es un problema que solo afecta a IOS 7, debido a que resetea la propiedad background una vez que se usa (si no me he enterado mal).
También he visto ejemplos de código en los que se asegura que dicho problema puede resolverse usando Media Queries, pongo algún ejemplo que he encontrado
Código:
@media (-webkit-min-device-pixel-ratio: 2) and (min-device-pixel-ratio: 2){
#principal{
background: url(../img/2x/[email protected]) no-repeat 0 0 !important;
width: 200px;
height: 100px;
}
}
@media (-webkit-min-device-pixel-ratio: 2) and (min-device-pixel-ratio: 2){
#principal {
background: url(../img/2x/[email protected]) no-repeat 0 0 !important;
background-size: contain;
}
}
Sin embargo no consigo que funcione correctamente. ¿Alguien me puede guiar un poco?. También he de decir que he buscado previamente en el foro, y aunque salen temas relacionados con background-size, no es precisamente la duda que tengo.
Un saludo a todos