[SOLUCIONADO] Web aparece de forma extraña en móviles

[Luisa29]

Hola a todos, resulta que mi página web tiene un ancho de 850 px y cuando se muestra en dispositivos móviles aparece con franjas negras a los lados.
Pues bien, he intentado usar esta meta tag para que ocupe la pantalla completa en los dispositivos:

Código:

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

El problema es que nada más abrir la web en el dispositivo móvil se muestra ampliada por defecto y sólo se ve una esquina. Pero al hacer el gesto típico de pellizco la web se coloca en su sitio, sin franjas negras a los lados, es decir, perfecta.

¿Por qué no se muestra así desde el principio? ¿por qué al abrir la web sólo se muestra esa porción de la esquina ampliada?

A ver si es cosa de esa meta que he de añadir algo más, ¿alguien me echa una mano?


EDITO:

Aquí un chico con el mismo problema en Stackoverflow (no solucionado):

http://stackoverflow.com/questions/2...to-have-effect





Aquí su web, sigue sin solucionarlo, lo he mirado en mi móvil y su web tiene el mismo problema que la mía:

http://litvin.co.nf/viewport_index.html

No logro encontrar la solución, ese chico tampoco. ¿Podéis echarme una mano?

[DesgraciadoGabo]

Cuales franjas negras yo no las vi

Bueno, básicamente es por que tu web no esta diseñada para este tipo de resoluciones!

Es, por así decirlo, si yo trato de meter una hoja tamaño tabloide a un porta retratos es obvio que en dado caso veré sólo una parte del tabloide, lo mismo esta pasando en los dispositivos, tu web debe estar diseñada con un ancho mayor a los 800px por esta razón alguno de los usuarios del link que dejaste dice que en width=device-width lo cambie por el ancho de su sitio, que en ese caso es de 800px

Si te interesa que se vea el contenido perfectamente lee un poco de media queris en css esto hará que tu diseño se ajuste al ancho del dispositivo con el que se esta visualizando tu sitio web.

El tema de que se vea esa esquina del lado izquierdo es cuestion del navegador, seguramente se coloca ahí por que en ese punto es donde se encuentra la coordenada 0.

Si dije alguna estupidez que alguien me corrija pero en general esas son mis observaciones, espero te sirvan.

Saludos

[Luisa29]

Gracias por contestar DesgraciadoGabo, resulta chocante pero he logrado solucionarlo, no sé si se verá bien en los demás dispositivos.

de esta forma, poniendo esto así: initial-scale=-1.0

A ver si me podéis decir si esto está bien o mal.

[DesgraciadoGabo]

Esta bien si cumple tu necesidad, lo mejor es diseñar un sitio que se ajuste segun la resolucion del dispositivo.

Lo digo principalmente por que en el caso de tu sitio con un smartphone, el que sea, tendrás que hacer zoom en el texto para poder leerlo, en el caso de un diseño adaptativo tu sitio web se verá sin necesidad de hacer zoom, tal vez esta imagen ilustre un poco lo que te comento:


Eso se hace con media queris @media screen and (max-width:anchopx) y la cosa es ir modificando tus estilos segun el ancho por el que vas enfocado ya sea el de una tablet, un smartphone u otra resolucion.

Espero no haberte confundido, pero si no te queda muy claro puedes googlear un poco acerca de media queris, Saludos!!!

[Luisa29]

Iniciado por DesgraciadoGabo

Esta bien si cumple tu necesidad, lo mejor es diseñar un sitio que se ajuste segun la resolucion del dispositivo.

Lo digo principalmente por que en el caso de tu sitio con un smartphone, el que sea, tendrás que hacer zoom en el texto para poder leerlo, en el caso de un diseño adaptativo tu sitio web se verá sin necesidad de hacer zoom, tal vez esta imagen ilustre un poco lo que te comento:


Eso se hace con media queris @media screen and (max-width:anchopx) y la cosa es ir modificando tus estilos segun el ancho por el que vas enfocado ya sea el de una tablet, un smartphone u otra resolucion.

Espero no haberte confundido, pero si no te queda muy claro puedes googlear un poco acerca de media queris, Saludos!!!

Muchas gracias Gabo, pero prefiero que se vea tal y como realicé la web. Es un tanto complejo todo.
De todas formas yo incluso a su tamaño puedo leerla perfectamente, además de poder hacer zoom cuando quiera si hay algo que vea muy pequeño.