Sunday, 17 July 2011

Using Max & Min width in IE6

Min & Max width are both great tools to have in your design arsenal, but unfortunately they don’t work in IE6, so what do we do?
We usually lock down the width of our site instead of creating the ideal fluid layout we want, sacrificing user experience for
out of date browsers.

Luckily, we can use a short JavaScript command targetting IE to accomplish a nice fluid layout with max & min widths in IE6:

#page-wrap
{
min-width:800px;
max-width:1000px;
width:expression(document.body.clientWidth < 800? "800px" : document.body.clientWidth > 1000? "1000px" : "auto");
}


In the above example, you can see that the smallest width for this page is 800px, and the largest is 1000px; not much of a flex,
but the concept can be applied to any element.

And if you only wanted to use min-width:

#page-wrap
{
min-width:800px;
width:expression(document.body.clientWidth < 800? "800px": "auto" );
}

adn also can try this-one


.with_minheight {
  min-height:550px;
  height:auto !important;
  height:550px;
}

No comments:

Post a Comment