Let me say first that I like Netscape. It's what I use at home, every night. But Navigator 4 came out when CSS1 was barely six months old, and you can tell that style sheets were added to it in a hurry. Plenty of your visitors are going to be on Navigator 4 for a long while yet, so here are the three things I've learned to expect, and the rule that gets me through them.

1. Styles stop at the table's edge

You write a rule for BODY, the whole page comes up in Verdana, and then everything inside a table comes up in Times. Netscape 4 doesn't pass your BODY styles down into table cells. Since nearly every home page is built on tables, that's nearly every page.

The cure is to name the table cells yourself, right alongside BODY. The same goes for color and size:

Charlotte Purvis says the same thing on her fonts page, Same Face Twice: name TD as well as BODY, because Netscape 4 forgets your font as soon as it gets inside a table. She set type for a living, so when she and I agree, you can take it to the bank.

2. Styles can vanish

Make your Netscape window a little narrower and it redraws the whole page from scratch. Every so often, when it does, it forgets the style sheet. The page comes back in plain Times with underlined links, as if you'd never written a rule. Press Reload and the styles come back. Your visitor may not know to do that.

There's a second way to lose them. Netscape 4 reads style sheets with its JavaScript engine, so anybody who has turned JavaScript off in Navigator has turned off your style sheets too, whether they meant to or not. A lot of offices switch JavaScript off on every machine. The people at those desks never see a single one of your styles.

You can't fix either one from your end. All you can do is make sure the page still works when it happens. That's number 4.

3. Borders and backgrounds draw oddly

This is the one that made me start this site. Here's a rule for a little note box, blue behind the words with a thin border around it:

In IE 4 and 5 you get exactly what you'd expect: a neat pale blue box with a border. In Netscape 4 you get the border, then a strip of white between the border and the blue, and the blue only behind the lines of text. Colored bands behind headings (recipe 5) do the same thing: the color often stops where the words stop. Margins and padding don't add up the way IE adds them, either, so the space between your paragraphs jumps around from one browser to the other.

What I do: if a box really matters, I make it a table. A one-cell table with a BGCOLOR and a border looks the same in every browser made since 1996. Every code box on this site is a table for that reason. I save the style sheet borders for things that can come out a little crooked without hurting anybody.

And while we're here: don't lay out your page with style sheet positioning yet, the kind where you tell a box to sit 200 pixels from the left. IE manages it. Netscape 4 puts the box somewhere near where you asked, on a good day. Tony Perlman explains on Tables for Layout why tables are still what works for everybody, and how to do them right.

4. My rule: it has to read with styles off

Between Navigator dropping styles when the window moves, people with JavaScript switched off, and the old browsers in every school lab, some of your visitors will see your page with no style sheet at all. So before anything of mine goes up, I look at it that way, and it has to make sense.

To turn style sheets off in Netscape 4: Edit, Preferences, click Advanced, and uncheck "Enable style sheets." Then press Reload. (Remember to check it again when you're done.)

In Internet Explorer there's no single switch, but you can come close: Tools, Internet Options, the Accessibility button, and check the boxes to ignore the colors, font styles and font sizes specified on Web pages.

What I check for:

• The page colors are in the BODY tag (BGCOLOR, TEXT, LINK, VLINK), not only in the style sheet.
• FONT tags are still underneath for the typeface and the sizes. Belt and suspenders.
• Text color and background color are set in the same place, so they come and go together. (White words on a blue band, with only the blue in the style sheet, become white words on white.)
• Nothing important is said by style alone. If a line is a warning, it says "Warning," instead of just being red.
• The layout is a table, so nothing falls on top of anything else.

Yes, it's more typing, and the files come out a little bigger. But a page that only works when everything goes right isn't finished. A page that looks good in IE 5, looks all right in Netscape 4, and still reads with the styles gone: that's the whole idea of this site.

Back to the front page or the eight recipes.