Min-width issue in IE6

min-width-issue-in-ie

This is something for those who care for IE6 and not W3C Standards. Recently I worked on a project, for which the layout was liquid and one of the requirements was to use a minimum width of 1000px. Is that a problem? Not at all.

The problem was to make it compatible on all major browsers, including IE6 !!!!!. I wonder why people still use IE.

As usual, I started searching for the solution on the right top of my Firefox window (yes, google!) and found a few websites which had discussions on the same topic. Most of them had lengthy posts and not the real solution. After going through a couple of sites, I concluded with the following solution. I hope this would help those who come across the same problem.
.div_class_name{
width: expression(document.body.clientWidth < 1002? "1000px" : "auto");
}

Just add the above line in your CSS. Replace 1000px with the min-width value and replace 1002 with a value slightly greater than the min-width. To define the max-width, just replace the "<" with ">".

Known Issues:

  • Only works with JavaScript enabled browsers
  • Not W3C valid

That's all! I don't want this post to be lengthy like the others I went through :)

This 1z0-054 tutorial is for perfect for beginners . Become expert in web designing using 70-272 guide and 642-971 design tutorials.

Our ccent course includes the every thing that you have to learn for VCP-410 exam. Subscribe for ccie training to pass real exam on time.

About Gopal Raju

Gopal Raju is a passionate designer, developer and blogger from India. He’s the founder of Convax Solutions, a web design and development agency in India. Catch up with him on dribbble, Twitter and Facebook.

5 Responses to Min-width issue in IE6

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

  1. Nice post u have here :D Added to my RSS reader

  2. Pingback: Min-width issue in IE6 | CrazyLeaf Design Blog

  3. Pingback: csskit.net

  4. Pingback: vot.eti.me

  5. I recently wrote a solution to this problem too: http://www.webcoders.com.au/minWidth.html

    Usage is: width: expression(IE6MinWidth(this, 400));

    It takes into account the margin, padding and borders of the object so IE doesn’t crash in a spectacularly bad fashion. Its also added using conditional css so it will pass W3C validation and only load for IE6.

    Only reason I link this is because your solution will still cause IE to crash if the element has padding, borders etc.