weird behaviour with scrollWidth property

[daveh0]

I'm trying to use IE expressions within a CSS file to simulate the unsupported min-width property

To do the same for min-height, the following works fine

height: expression( this.scrollHeight < 300 ? "300px" : "auto");

I would think that this should work fine as well, but it doesn't

	width: expression( this.scrollWidth < 300 ? "300px" : "auto" );

Instead, it freezes the browser and sends the CPU usage through the roof as if there was an infinite loop defined.

To troubleshoot, I tried this:

	width: expression(alert(this.scrollWidth));

I would expect that a value would be alerted once. Instead, it alerts twice when the page loads and then 2 more times every time I move my mouse over the element I'm applying this style to.

Any idea why scrollWidth seems to be evaluated over and over where scrollHeight does not?

[MikeFoster]

Hi daveh0,

I played with this some, used different properties and conditions - I don't have an answer but I do see what you ran into. The width gets set to '300px' then 'auto' then repeats this over and over, because auto results in width < 300. I tried "<=" and even considered padding and border effects on width. I did get it to not 'hang' - but I did not come up with a real 'min-width'.

While browsing for info I came across this good post by Tommy. Using expression can cause printing problems - check that out.

[Pepejeria]

CSS expressions are evil, try this instead.