Problemas de adaptabilidad del diseño Responsive en móvil

  • Autor Autor token
  • Fecha de inicio Fecha de inicio
T

token

Zeta
Verificación en dos pasos activada
Hola, maquete mi sitio tipo responsive design para que se adapte ya sea a una pc de escritorio, tablet o movil, el tema es que al achicar el navegador se adapta perfecto pero al ingresar desde mi celular Sony Xp M se va muy mal... pero si tildo la pestaña ver como ordenador, se ve muy bien

Me estoy pasando algo por alto seguramente...
 
Entra desde incógnito en tu navegador del móvil. Si se sigue viendo mal, entonces es que no lo hiciste bien el responsive.
 
El responsive no esta hecho para tu celular, o solo has hecho responsive en base a 1 modelo y son varios los que se debe hacer. Aunque también se puede hacer para cada dispositivo mobil pero eso es mas trabajoso y solo para webs donde sus visitas provengan de tal dispositivo.
 
Si funciona en el escritorio pero no en el smartphone es posible que no ayas agregado el veiwport

<meta name="viewport" content="width=device-width, user-scalable=no">

O simplemente les media queris que usaste no funcionan para tu smartphone y habria que cambiar los breakpoints.

espero funcione
 
Antes que nada muchas gracias por sus respuesta. Me ayudaron a darme cuenta que había maquetado mal el menu ya que elimino esa parte y funciona muy bien.

Parece una pavada, pero por ahí uno se marea un poco con el código y comentarios como los que me brindaron ayudan muchismo

Gracias esativo por sugerirme el sitio para testear sitios. Me será de gran ayuda.

Un saludo y muchas gracias por su ayuda
 
Te faltó esto: <meta name="viewport" content="initial-scale=1">
 
Tienes que manejar el css responsive por media es decir: [MENTION=16931]medi[/MENTION]a (min-width:320px) { /* smartphones, iPhone, portrait 480x320 phones */ } [MENTION=16931]medi[/MENTION]a (min-width:481px) { /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */ } [MENTION=16931]medi[/MENTION]a (min-width:641px) { /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */ } [MENTION=16931]medi[/MENTION]a (min-width:961px) { /* tablet, landscape iPad, lo-res laptops ands desktops */ } [MENTION=16931]medi[/MENTION]a (min-width:1025px) { /* big landscape tablets, laptops, and desktops */ } [MENTION=16931]medi[/MENTION]a (min-width:1281px) { /* hi-res laptops and desktops */ }
 

Temas similares

Atrás
Arriba