[SOLUCIONADO] ayuda!web no se adapta al movil

[marijos]

Hola! estoy haciendo una web con html +css y estoy teniendo unos problemas un poco raros...

para hacerla "responsive" estoy trabajando con
@media only screen and (min-device-width: 320px) and (max-device-width: 480px)

Cuando lo pruebo con Dreamweaver funciona guay pero en el movil lo que hace es ponerlo con unos márgenes muy grandes y todo más pequeño...

alguien sabe por qué ?? gracias!!

[sprwilly]

Hola marijos, quizás en lugar de utilizar device-width, deberías usar width, por ejemplo:

@media only screen and (min-width: 320px) and (max-width: 480px)

device-width tiene en cuenta únicamente la resolución de pantalla, independientemente del espacio que el navegador web del dispositivo le quite a la resolución total.

Si quieres pasa un enlace a tu web y le doy un vistazo si no consigues solucionarlo así.

Saludos!

[marijos]

sigue sin funcionar... es muy raro:

cuando NO ponemos device no se ve en el movil, pero cuando SI lo ponemos (max-device-width: 480px) se ve bien en el ordenador pero en el movil se ve todo muy pequeño...
por que??

gracias de antemano!

[sprwilly]

Puedes intentar quitar el min-width, para que siempre que el ancho sea inferior a 480px te aplique esos estilos, o también puedes probar jugando con los valores de píxeles, todo depende de la resolución del móvil que estés usando para hacer las pruebas pero de todos modos debería aplicarte los estilos que hayas puesto fuera de @media.

Saludos

[sergio1210]

¿Incluiste el viewport?

[marijos]

Hola y gracias! pero... qué es lo de viewport??

[sergio1210]

http://revolucion.mobi/2012/02/14/mo...cala-correcta/

Versión resumida:

Añade este meta en el head de tu html:

Código HTML:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/> 

[marijos]

Justo !

ahora funciona de maravilla. Mil gracias!!