Maximum width in IE6

HTML & CSS
1

hii…

Maximum Width (max-width) is not working in IE6. I have a three column layout. Left and Right columns are of fixed width while middle column is of liquid width. It’s working in all the browsers except IE6.

Here is the code:

#wrapper {
margin: 0 auto;
padding: 0;
width: 100%;
min-width: 780px;
max-width: 1280px;
}

#header {
float: left;
margin: 0;
padding: 0;
}

#logo {
float: left;
background: url(…/images/logo.gif) no-repeat;
width: 92px;
height: 30px;
margin: 10px 0;
}

/content area/
#contentwrapper{
float: left;
width: 100%;
margin-top: 21px;
}

#contentcolumn{
margin: 0 262px 0 262px;
}

.inner-padding{
margin: 20px; /Margins for inner DIV inside each column (to provide padding)/
margin-top: 0;
}

/left column/
#leftcolumn{
float: left;
width: 262px; /Width of left column/
margin-left: -100%;
background: #C8FC98;
margin-top: 21px;
}

/right column/
#rightcolumn{
float: left;
width: 262px; /Width of right column/
margin-left: -262px; /Set left marginto -(RightColumnWidth)/
background: #FDE95E;
margin-top: 21px;
}

Please have a look on two screenshots attached. I don’t know how to fix it. Please Help!

Thanks in advance.

2

I’ve put Paul’s JS in my design templates. It works very nicely and doesn’t cause the other browsers to throw hairballs.

3

It works very nicely and doesn’t cause the other browsers to throw hairballs.

cough another cat reference cough cough?

hack

hack BLAAARG

Ah, better.

4

thank u all !!!

5

So far all of my current min-max width sites give IE6 set widths. If people want more flexibility from me, they’ll have to use a different browser. It’s still functional and readable, tough. : )

6

Is there still need to support IE6 to such a degree?
ducks and rolls

7

As long as its usable I don’t think there’s a need to go too far out of your way to support IE6. Of course it does depend on the client and the audience as well.

8

Flex width is a nicety, not a necessity. You want lace, you gotta do the switch : )

9

Hi, max-width isn’t supported in IE6, The easiest way would be to either use an expression, or don’t give IE6 max-width

10

You can find a min/max width implementation in my demo here.

http://www.pmob.co.uk/temp/3col-sticky-footer-min-max2.htm

It uses a once only expression to avoid the speed issues associated with expressions.

We had a quiz about this and it can be done [URL=“http://www.pmob.co.uk/temp/max-width-ie6-min-width.htm”]without JS like so but of course complicates the html more than it needs to be.