Haciendo que el contenido div responda

Question

Mi contenido no responde en este momento. Lo probé en un iPhone y el texto pasa por la pantalla.

he cambiado el CSS de mi recipiente para:

#container2 { 
    width: 960px; 
    max-width: 90%; 
    position: relative; 
    left: 50%; 
    margin-left: -480px; 
    line-height: 1.4em; 
} 

Cuando la prueba que después del cambio, el contenido desaparece. Leí que poner ancho máximo: 90%; permitiría que no exceda el ancho del límite (http://webdesignerwall.com/tutorials/5-useful-css-tricks-for-responsive-design) pero obviamente no funcionó. ¿Qué estoy haciendo mal?

Answer 1

probar esto css:

/* Show in default resolution screen*/ 
#container2 { 
width: 960px; 
position: relative; 
margin:0 auto; 
line-height: 1.4em; 
} 

/* If in mobile screen with maximum width 479px. The iPhone screen resolution is 320x480 px (except iPhone4, 640x960) */  
@media only screen and (max-width: 479px){ 
    #container2 { width: 90%; } 
} 

Aquí la demo: http://jsfiddle.net/ongisnade/CG9WN/

Answer 2

No

mucho ir allí, pero creo que lo que estás buscando es voltear los width y max-width valores:

#container2 { 
    width: 90%; 
    max-width: 960px; 
    /* etc, etc... */ 
} 

Eso te dará un contenedor que es el 90% del ancho del espacio disponible, hasta un máximo de 960px, pero eso depende de que su contenedor pueda redimensionarse. El diseño receptivo es una gran bola de cera, así que esto ni siquiera araña la superficie.

Answer 3

@media screen and (max-width : 760px) (para tabletas y móviles) y los utilice con esta: <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">