pagina web se adapte a cualquier resolucion

fedefrankk · #1 (**permalink**) 08/04/2013, 11:31

Hola a todos, estuve gogleando un poco, y nadie da codigo seguro a como ajustar una web al 100% de cada resolucion, copie uno de java, que detecta las resoluciones y cambia con zoom el tamaño de mis elementos, resultado final.. un azco.!!!

mi pagina siempre la he construido centrada con un ancho de 1024px, se ve en cualquier monitor.. pero ya es hora de saber como hace una pagina que se adapte a cualquier resolucion.. supongo que con css,

mi codigo es el siguiente:

Código CSS:

Ver original.wrapper{ border:#0F0 1px solid;
    width:1024px;
    height:auto;
    margin: 0 auto 0 auto;
    margin-right:auto;
    margin-left:auto;
    margin-top:0px;
    padding:0px;
}

Desde ya muchas gracias y cualquier ayuda es muy bienvenida.!!!!

Saludos a todos.
fede

Middrel · #2 (**permalink**) 08/04/2013, 11:40

Tienes que buscar sobre media queries, por ejemplo http://mediaqueri.es/. Hay mucha información sobre esto y muy buenos tutoriales, además de que el CSS lo manejarás ahora en porcentajes.

Saludos!

JuanRios · #3 (**permalink**) 08/04/2013, 11:59

Busca información sobre Responsive Design, básicamente se establecen las anchuras mediante porcentajes. Después le das distintos comportamientos según los tamaños mediante los media quieres, para distribuir el contenido según la resolución:

Aquí tienes una pequeña aproximación: http://www.tuprogramacion.com/desarrollo-web/que-es-responsive-design-y-como-usarlo/

pzin · #4 (**permalink**) 08/04/2013, 12:00

Realmente tendrías que mirar algo de diseño líquido y trabajar con medidas relativas. Usar RWD sería el siguiente paso.

Por ejemplo, en lugar de darle un ancho fijo a .wrapper, le das un ancho de 100%.

fedefrankk · #5 (**permalink**) 08/04/2013, 12:24

Hola, muchas gracias a todas las rspuesta, seguire buscando y viendo los tutoriales.
Gracias.!!!