Max-width property not working in Firefox

Well, I’ve already posted this on one forum full of web-savvy people and the outlook isn’t looking too good… and this forum looks practically dead… but since I’m with Dreamhost it seems like the logical next stop.

Now, with Microsoft’s browser falling behind in regards to standards, I’ve found alternate solutions that emulate both min-width and max-width in IE, and they’re working wonderfully.

But when testing the page in Firefox, the min-width property is working, but max-width isn’t. And since the max-width method I’m using for IE requires expression() which Firefox doesn’t have, the cell just stretches entirely across the page, which is exactly what I want it not to do.

And Firefox is apparently supposed to support this property, so I can’t find a solution for it anywhere online. My first idea was that my version was out of date (which it was) so I downloaded 1.5 in hopes that the issue would go away… but it didn’t.

Soo, I’m drawing a blank here. Have any of you used max-width in your layouts? Does it work for you in Firefox? Any ideas of what my problem might be?

I’m sorry I don’t have the spare time right now for a proper answer, but I have seen max-width implemented and working (properly/hacked?) in Firefox - the most recent example that comes to mind is the popular Joomla/Mambo “WaterandStone800” template.

**Edit: The rest of my post was FUBAR, and had to be “put down” - The “right” answer is gordaen’s post


Simply doing

works fine in FF. Could it be that the work-around for IE breaks FF or that you had removed the max-width when doing that workaround?

Check out Gordaen’s Knowledge, the blog, and the MR2 page.

Now that is a helpful post…I’ve edited mine for accurracy and pointed to your post in the edit. Thanks for jumping in with real help!


Yeah, you might actually want to post your code or link to a web page using the code in question that demonstrates the problem. Until then we can only guess what your problem is and point you to examples that do work.

:cool: [color=#6600CC]Atropos[/color] |

Ohhh, I see the problem now, thanks to Gordaen’s post: I was using max-width in a table rather than a div. It didn’t occur to me that when I emulated min-width in IE, I had enclosed the table in a div with the min-width property, which is why it was working in Firefox but max-width wasn’t. Now I can simply enclose the text in those particular cells with a div as well.

I know that I should be using divs in the first place… but I’m really not going to worry about validation at this point.

Thanks for your help!