My first time here, and I noticed this question on max-width.
The problem of course is that IE doesn't recognize that property, but there IS a way around it. Unfortunately, the line of code wont validate, but blame IE for that, for not having a decent browser!!
This will apply to a main content table too, so you can go full width, but stop it expanding beyond a certain point. Say 1000px, that way you don't get your line length too long for comfortable reading.
Suppose you want the table to expand to 500px, but no wider?
In your style sheet, put the max-width: 500px; in the correct place. (in the body} section)
Now, you need to define how your table displays with IE
so add in this.
table {
width:expression(document.body.clientWidth > 500? "500px": "auto" );
}
This is for IE....it will work on versions above 4.
What it's saying, is, is the table wider than 500px? If so, make it 500px....anything below will expand to an auto width.
Firefox will ignore this, and IE will ignore the max-width, so you need both of them.
Unfortunately, the ? will stop a clean validation, but thats about the easiest way around the problem. There are other solutions, using ems, but they are more complex.
If only IE would design a compliant browser, these sort of problems wouldn't arise!
Cheers, Jonny.
-Jonny
Reply