Quirk : CSS Expressions in IE
TechnicalSo by now, most web-centric developers have come to the stark realization that IE sucks (although IE 7 shows progress). While this is true, there is often an IE-specific workaround to its own suckage. Today's quirk is brought to you by one of those IE-specific workarounds.
The project I'm currently working on includes a set of nested containers that are visually delineated by color. Several of these need to be 100% of the height of the parent container. Since I've never managed to successfully navigate the CSS complexity of defining a 100% height, I've started avoiding it all together. Instead, I use absolute positioning to define the containers corners.
Easy right? But it doesn't work in IE. Absolute positioning works, but IE decided that, if a left value is defined then it need not care about the right value. It simply ignores it and the width is instead defined by the content. Same for top and bottom. If a top value is defined then the bottom value is ignored. Argh.
The IE-specific workaround - well, the one that I prefer, anyway (there are probably many) - involves the use of IE expressions. So today I'm working on my IE style sheet and building an expression to implement this same aesthetic.
It didn't work. Care to guess why? I looked at this for nearly two hours and tried every combination of JavaScript objects and constants I could think of. Finally, I got it. It wasn't working because I like to use a lot of space. The spaces before and after my open and close parentheses prevented the properties from being read.
Some days I don't mind dealing with IE's issues. They're a pain, yes, but there's usually a relatively painless workaround that can be shoved into an IE-specific style sheet. Other days (like this one)...
IE just sucks.






Loading....