Ver Mensaje Individual
  #5 (permalink)  
Antiguo 30/09/2014, 15:31
Avatar de letsalcido
letsalcido
 
Fecha de Ingreso: abril-2009
Ubicación: Monterrey, N.L, México
Mensajes: 185
Antigüedad: 15 años
Puntos: 13
Respuesta: Dividir pantalla en 6

Cita:
Iniciado por Franchesquini Ver Mensaje
Para que se ajuste a todas las resoluciones de pantalla tenés quie hacerla responsive.

Probá poniendo esto en el <head>


Código:
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
y esto en el css (editá de acuerdo a tu html)

Código:
/* para 980px o menos */ 
@media screen and (max-width:980px) {
 .container { 
width:98%; 
} 
section { 
width:68%; } 
}

/* para 700px o menos */ 
@media screen and (max-width:700px) { 
aside,section { 
float:none; width:96%; 
}
 nav, section { 
font-size:1.2em; 
} 
aside { 
margin-top:5px; 
}
 nav ul { 
float:none; clear:both; 
} 
} 

/* para 480px o menos */ 
@media screen and (max-width:480px) { 
aside { 
display:none; 
} 
nav, section { 
font-size:1.5em; 
} 
section { 
width:94%; 
} 
nav ul { 
float:left; 
clear:none; 
width:50%; 
} 
nav ul li { 
float:none; 
} 
}
Franchesquini, con todo respeto pero he visto dos posts tuyos diciendo que con esos códigos se logra hacer responsivo un sitio. Lamentablemente hacer que un sitio sea responsivo está muy lejos de ser un par de códigos extras en el css. Por favor no confundas a las personas que apenas van aprendiendo diseño web.

El diseño responsivo es una técnica en donde se usan media queries (@media) para determinar el tamaño de la pantalla y entonces aplicar un grupo de estilos a los elementos que el diseñador web decida. El viewport meta es requerido para que funcione esto, pero el css que posteas puede que funcione pero en un caso específico. Cada sitio tiene su propio grupo de mediaqueries para que se muestre correctamente.
__________________
Estudio de diseño web
Huasteca Publicidad