Válido para XHTML 1.0 Estrícto + CSS
Una de las recomendaciones para el dise�o de páginas web, es que tengan un dise�o líquido, esto quiere decir, que se adapte automáticamente al ancho de la pantalla, independientemente de la resolución. Sin embargo, hay casos cuando queremos que una página tenga un ancho mínimo para mantener cierta estética aunque los usuarios tengan minimizadas las ventanas de sus navegadores. Podemos hacer tal efecto con la propiedad min-width. Como ejemplo, si haces chica la ventana de tu navegador en esta página, podrás ver que tiene un ancho mínimo de 600 pixeles. También mostramos de paso el uso de la propiedad max-width, que hace exactamente el efecto opuesto.
El código:
<style type="text/css">
#minimo{
border:#000 solid 1px;
background:#cff;
min-width:600px;
max-width:1000px;
height:200px;
}
</style>
El código para IE 6-:
Desafortunadamente, nuestro buen amigo Internet Explorer 6 y menor, desconocía las propiedades min-width y max-width, por lo que tendremos que agregar un truco especial para que simule las mismas propiedades, quedando de la siguiente forma:
<!--[if lte IE 6]>
<style type="text/css">
#minimo{
width:expression(
(document.documentElement.clientWidth < 600)? "600px" :
(document.documentElement.clientWidth > 1000)? "1000px" : "auto" );
}
</style>
<![endif]-->
Cómo implementarlo:
<div id="minimo">Divisor con anchos mínimo y máximo.</div>
