To be able to get around this, you could create a css expression, such as detailed here.

CSS expressions are a bit dodgy, and are slower to run then javascript.

You can also manipulate javascript a bit easier, deciding exactly when and where to run it. CSS files should be kept fairly basic, things like this should be moved into a javascript file you can use across other sites.

Even then though, I’ve had issues with IE6 freezing when running the javascript.

After some fiddling, it seemed to work better if the units I used when setting the width with “container.style.width” were the same as used in your css file.

	window.onload = loadAll();
	window.onresize = minMaxWidthFix;
 
	function minMaxWidthFix(){
		var container = document.getElementById("outer");
 
		if(document.body.clientWidth >= 1200)
		{
			container.style.width = "120em";
			return true;
		}
 
		if(document.body.clientWidth <= 800)
		{
			container.style.width = "80em";
			return true;
		}
 
		container.style.width = "100%";
 
	}
 
	function loadAll(){
		//Other IE functions you want to run, eg fixing li:hover support
		minMaxWidthFix();
	}

So if your having problems running min/max scripts, try changing your container.style.width value to em’s, px, cm’s, percent or whatever unit you’re using for the container element.

You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.