Internet Explorer 6: The legacy

Internet Explorer 6 is dead (almost). It has been for while, we’ve buried it, danced on its grave, and paved over the cemetery. And good riddance.

But the most-hated browser in history wasn’t all bad - it turns out that it actually did do some things right.

Border-box

A common gotcha writing CSS is the fact that element widths aren’t necessarily the width you specify; the width of an element is actually the sum of the specified width + padding + borders.

But not in IE6 - at least in quirks mode. Contrary to the CSS spec it insisted on using the literal width you’d specified. In many cases, this is way easier to work with. Thus, it has been introduced into CSS as box-sizing: border-box - thanks to IE6.

Inline block elements

Another thing IE6 seemingly got right - again, in spite of the CSS spec - was its interpretation of display: inline. Normally, you can’t set width and height and other block-like rules on inline elements. But psh, who cares - in IE you could.

Turns out, that idea was so useful that we’ve now standardized and dubbed it display: inline-block.

Embedded fonts

Over the last few years, the use of custom fonts on websites have soared thanks to services like Typekit and Google Fonts - all powered by the @font-face declaration, which Internet Explorer introduced. back in version 4.

However, true to form Microsoft insisted on the proprietary EOT format for the embedded fonts - a format no other browser supported. Go figure.

Dynamic calculations in CSS

CSS3 introduced the calc() function that can be used in CSS:

width: calc(100%/3 - 2*1em - 2*1px);

which can be incredibly useful. That’s also what Microsoft thought, when they introduced dynamic properties in Internet Explorer 5. Albeit not quite as powerful as calc() - and supposedly quite a bit more broken - dynamic properties did allow you to do stuff like

<div style="left:expression(document.body.clientWidth/2-oDiv.offsetWidth/2)"></div>

Vector graphics

With resolution independence becoming ever more important, the need for a scalable, non-raster graphics format increases. Internet Explorer dating back to IE5 supported VML - which was exactly that.

These days, SVG is the format to use. SVG is based in parts on VML. As a somewhat ironic turn of events, VML is exactly how you’d polyfill SVG in old Internet Explorers.

XMLHttpRequest

XMLHttpRequest puts the X in AJAX and pretty much enables the current breed of highly responsive interactions in websites and -applications.

While IE6 didn’t introduce XMLHttpRequest - it was actually introduced in IE5 as part of the MSXML ActiveX component - IE6 did support it and was around when AJAX started getting popular.

RIP

When Internet Explorer was released, it was an advanced browser with tons of useful features and it has played its part in moving the web forward.

Unfortunately, thanks to a bunch of odd choices - and outright bugs - in its rendering engine and Microsofts negligence in its later years, the legacy of Internet Explorer 6 isn’t something we’ll look back on with favorable eyes.

Goodbye IE6, we knew you all too well.