Background Div

[calle_lzs3]

Buenas noches. Necesito vuestra ayuda. Tengo una web con diseño reponsive. Y funciona todo correcto, salvo una cosa, si el background de un div es color todo correcto. Pero si pongo background: url y una imagen en el url. Por ejemplo de la siguiente manera.

#main > section.home
{
background:url(../images/banner.jpg) no-repeat center center;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover;

}

Se ve correcto en todos los navegadores, pero en los moviles/tablets, se posiciona centrada y no veo los laterales, por lo tanto la redimensión no la hace correcta. Yo necesito que se ajuste el fondo del div a cualquier resolución.

He estado pensando probar con javascrit, a veces para el body he usado un plugin pero no se como adaptarlo a un div.

Por favor alguien que me ayude que ya no se que hacer.

[pzin]

Pues al verse los laterales, tendrías el problema de que en la vertical estaría vacío, o en su defecto, la imagen deformada.

La solución, diría yo, sería usar una imagen diferente para la versión móvil. O si es una imagen con demasiado detalle, quitarla directamente para móviles.

[AngelKrak]

prueba poniendole el background-size: 100% 100%; y para mejor cambiale tu code

background:url(../images/banner.jpg) no-repeat center center;

por este:

background-image: url("../images/banner.jpg");
background-repeat: no-repeat;
background-position: center center;
background-size: 100% 100%;

[fede5426]

No va a mejorar ni empeorar nada que dejes el código del bg en una sola linea, pero si probá con cambiar el background-size:cover; por background-size:100%;, eso debería ser suficiente.

[AngelKrak]

lose, pero me gusta mas tenerlo asi a mi >_< pues que le intente con el BG-SIZE >_< y creo que habian dicho que era mejor asi este codigo (no me acuerdo quien lo dijo):

background-image: url("../images/banner.jpg");

[fede5426]

Iniciado por AngelKrak

lose, pero me gusta mas tenerlo asi a mi >_< pues que le intente con el BG-SIZE >_< y creo que habian dicho que era mejor asi este codigo (no me acuerdo quien lo dijo):

Las comillas, sean simples o dobles, son opcionales.. Funciona de todas formas si no las usas. A menos que tengas espacios en el nombre de tu imagen, en ese caso, sin comillas el navegador no encuentra la imagen, con comillas si.

[calle_lzs3]

Muchas gracias por la ayuda acabo de probar con el 100% y va todo perfecto. Me habia encebollado con el cover y sino java y no habia pensado en lo de toda la vida.

De verdad gracias por vuestra ayuda. Tema solucionado.