Netscape Navigator 4.0: The Messy Arrival of CSS

It’s June 1997, and the browser wars are turning into a full-scale battle of attrition. Netscape has just released Communicator 4.0 (which includes Navigator 4.0), and it’s a massive, multi-faceted suite of tools. But as a web developer, I’m focused on one thing: the CSS implementation.

We’ve been dreaming of CSS ever since the W3C spec came out last year. We want to stop using <font> tags and start using stylesheets.

The "Layer" Problem

Netscape 4.0 has a very strange relationship with CSS. Instead of following the W3C's "Box Model" strictly, they’ve introduced their own proprietary <layer> tag for positioning elements.

<!-- Netscape's proprietary way -->
<layer id="myLayer" left="100" top="100">
  <p>This is a positioned element.</p>
</layer>

<!-- The CSS way (which works differently in Netscape 4) -->
<div style="position: absolute; left: 100px; top: 100px;">
  <p>This is also a positioned element.</p>
</div>

The result is a nightmare for developers. If you use CSS for positioning, Netscape 4 often gets it wrong, or worse, crashes. To make things even more confusing, Netscape 4 introduces "JavaScript Style Sheets" (JSSS), an alternative to CSS that uses JavaScript syntax to define styles. It’s a dead end, but it’s adding more noise to the standards debate.

Document Object Model (DOM) Chaos

In Netscape 4, if you want to change the content of an element via JavaScript, you have to use the document.layers collection. In IE4, you use document.all. There is no "Standard DOM" yet.

The Bloat

Netscape Communicator is huge. It includes an email client, a newsreader, a composer, and an address book. It takes forever to load and uses a massive amount of memory.

Looking Ahead

Netscape is still the king of the market, but Microsoft is closing in fast with IE4. By trying to "win" with proprietary tags like <layer> and <spacer>, Netscape is making the web harder to build for. We are entering the "Golden Age of Browser Sniffing," where every website needs a complex script just to figure out which broken version of CSS to serve to the user. I hope the W3C can bring some order to this chaos soon.