adaptar una web para diferentes resoluciones

por cortesía de Creative Commons

Adaptar una página Web a diferentes
resoluciones: centrarla
Una pregunta frecuente que se encuentra en los foros es “¿Cómoadapto mi página Web a la
resolución de la pantalla de los usuarios?” ¿Qué resolución debo elegir?

La solución
La solución consiste en utilizar tamañosrelativos en la página (que cambien según el tamaño de
la ventana y de la pantalla de los usuarios). Lo mas común es utilizar la etiqueta body. Pero
también podemosutilizar div#corps u otro. Para adaptar el tamaño de la página, debemos
utilizar el siguiente código CSS:
body{width:100%;}
Con este código la página ocupara el100% de la ventana, cualquiera sea su tamaño.
Evidentemente podemos definir el tamaño que deseemos (90%, 80%, etc.) Si definimos un
tamaño más pequeño, podemoscentrar la página con "margin:auto".

Nota
/!\ Atención: es necesario definir el tamaño en porcentaje (%) y no en en otra unidad relativa,
ya que % corresponde aun porcentaje en relación al tamaño de la ventana, en cambio las
unidades en corresponden a la altura de las líneas (un tamaño predefinido).

Precisiones
Sies imprescindible que tu página no sea más pequeña que cierto tamaño, puedes utilizar la
propiedad min-width (no funciona bajo IE). También puedes utilizarmax-width para definir el
tamaño máximo. (No recomiendo esto ya que no es agradable tener una página que sea más
pequeña que la ventana.)

Ejemplo
Una página deancho al 90%, centrada, un ancho mínimo de 600 pixeles, y un ancho máximo de
2000 pixeles:
body{width:90%;margin:auto;min-width:600px;max-width:2000px}