Why isn't min-width working for ie6?

Question

I am coding exclusive ie6 css, wherein I am facing the problem. The footer does not take the min-width value whereas it accepts the fixed width value. I am using the repeat-x for an image and assigning a min-width value to it. The same thing I did with header div and it works perfectly fine. For example here is my code.

Header HTML which I have used for the same purpose.

<div id="header">
<!-- top-menu -->
    <div id="top-menu">
        <div id="left-logo">
        <a href="#"><img src="img/logo-left.png" alt="BhatkalNews" /></a>
        </div>
        <div id="navigation">
        <ul>
        <li class="contact"><a href="#"><img src="img/contact.png" alt="contact" /></a></li>
        <li class="photo"><a href="#"><img src="img/photo.png" alt="photo"/></a></li>
        <li class="video"><a href="#"><img src="img/video.png" alt="video" /></a></li>
        </ul>
        </div>
        <div id="right-logo">
        <a href="#"><img src="img/logo-right.png" alt="BhatkalNews" /></a>
        </div>
    </div>
</div>

And here is the css I have used.

#header {
    min-width: 1040px;
    height: 111px;
    background: url('../img/header-bg.jpg') repeat-x;
}

and for the same purpose the footer code is.

<div id="footer">
</div>

and the css

#footer {
    min-width:1040px;
    background:#36240A url('../img/footer.jpg') repeat-x;
    height:291px;
}

Why isn't footer assigning the min-width?

Answer 1

Min-width doesn't work with IE6 - no surprises there as IE6 is terrible.

There are some workarounds, here is one:

{width:90%; min-width:1040px}

Basically, use width with a percentage - you'll have to experiment on the percentage depending on what you are trying to achieve.

Answer 2

IE6(not even 7) does not support min-width.

try expresssions like

width: expression( document.body.clientWidth < 1040 ? "1040px" : "auto" );