CSS expression()

browser wars 2000 dead

JavaScript inside a stylesheet, re-evaluated by Internet Explorer on almost every event.

In 2026: Dead: removed in IE8 standards mode and never implemented anywhere else. It was the only way to fake min-width and max-width in IE6, and it was slow enough to make a page crawl, because the expression re-ran on scroll, resize and mouse move.

Where it came from: Microsoft dynamic properties, MSDN, 1998. Disabled by default in IE8, 2009. Wikipedia ↗

<style>
/* Fake max-width in IE6 */
.wrap {
  width: expression(document.body.clientWidth > 800 ? "800px" : "auto");
}

/* Fake min-height */
.panel {
  height: expression(this.scrollHeight < 200 ? "200px" : "auto");
}

/* Centre a fixed element, which IE6 also could not do */
.float {
  position: absolute;
  top: expression(document.body.scrollTop + 100 + "px");
}
</style>

<!-- The 2026 version -->
<style>.wrap { max-width: 800px } .panel { min-height: 200px } .float { position: fixed }</style>

sandboxed demo · breaks nothing but itselfrestart

More in browser wars