CSS expressions are supported only in Internet Explorer browsers. Basically it’s a way to include JS result into a value of any CSS attributes. As we all know certain CSS attributes works less then perfect in Internet Explorer. For example one of my co workers Max Fortun and I were working on a tool and he wanted to have a submit button stay on the top right corner of the screen, even if the user scrolls down.
We originally had our code like
[html]
[/html]
No matter what we did it just didn’t work like expected in Internet Explorer, in Fire Fox it was working just as intended. To solve this problem we used a easy solution using expression. Since expression only works in Internet Explorer we have correct values defined first so they get used by other browser which doesn’t support expression, then redefine / overload those attributes again using expression. This way only Internet Explorer uses the last defined values. For example see the solution below:
[html]
[/html]
With this solution we kept everything same as before except changed position to absolute and top value to be what ever the amount of scrolled area from the top. Since those definitions came after the initial top and position, it only got overridden for Internet Explorer. So using expression we were able to use objects available to javascript and have two distinct CSS styles for Internet Explorer and Fire Fox.



Add A Comment