In this case all browsers will see the content of the first external style (which is intended for NS4), but any declarations inside will be "corrected" when they download the second style. Whereas NS4 will see only the first style.

The same technique works if using local styles. See this little example re: the legendary NS4 "font-pixel" bug.

nice! guys.. i didnt know about the nolayer tag... must keep on reading.hehe...

webmarkart

10-03-2002, 08:28 PM

If you know a server side language like asp, you can determine the browser and link to the appropriate css. This requires you to maintain two separate css but it works.

manga101

10-03-2002, 09:03 PM

lol.. u read my mind webmarkart... yup doin that now..

i search around and found this tutorial and sample..

hope this help other noobs like me..:

===== ( JavaScript solution ) =====

This example shows one method of detecting a user's browser and link
the current document to a corresponding style sheet. This is
implemented in two parts: the main script which is written as a
separate .js file, and a calling script written within the HEAD of each
page that will link to the style sheets.

STEP 1: Copy this code and save it as a separate file, for example, as
css.js

Note that the above example assumes that you have four style sheets:
one for IE 4.0 and later, one for Netscape 5.0 and later, one for
Netsc
ape versions less than 5, and one for the rest. Make sure that
each <LINK href= ... > in the script points to the proper path and
filename of your style sheets.

STEP 2: Copy this code into the HEAD of each HTML document that you
intend to link to the stylesheets.

<script language="JavaScript" src="css.js"></script>

If you change the name and/or location of the main .js file in Step 1,
make sure that the <script src= ... > in Step 2 above references the
correct path and filename of the .js file, or the script will not be
called and thus not function as intended.

with IE4+: another option as below;
gLNGflag is a global variable to be set "language code" in other
function.
--------------< source code sample >------------
<script LANGUAGE="JavaScript">
<!--

simple... and works without huge amounts of code, just make ie.css for IE and other.css for others.

hope this helps :thumbsup:

your sooo right lol.. less headache on editing...

but what is the "gte" and "lt"? in ur condition??

do i just cut and paste and put in the HEAD tag?

redhead

10-03-2002, 10:10 PM

yeah, copy and paste it into the <head> section. the "gte" stands for "greater than or equal to" and the "lt" stands for "less than".

heres a nifty tutorial on conditional comments:

http://www.javascriptkit.com/howto/cc.shtml

:thumbsup:

realisis

10-04-2002, 07:16 PM

While I also use conditional comments where practical, and Redhead's suggestion is a good one, remember that the technique presumably excludes IE4 as well as NS4 and other browsers. If your intent was to exclude *only* NS4 the <nolayer> is a better option.

...

And Manga, I'm going to save you about 6 months worth of headaches and head-scratching:

If you use Javascript to fetch an external file via the document.write() method, the technique doesn't work properly on NS4.7. Here's why:

NS4.7 has another infamous bug whereby any external file (whether style or script) fetched via doc.write IS NOT LOADED THE FIRST TIME a webpage is loaded. Any subsequent reloads to the page *will* fetch the file though.

This is maddening because at home you tend to reload the same webpage over and over again when testing it or writing to it. Because of this, any problems you see disappear quickly on reload, you end up thinking the technique works fine, and you leave it as is. The bug is extremely difficult to isolate because it keeps coming and going.

Your visitors though, might only load the page once. They'll never see the stylesheet you intended to fetch.

If however you use a server-side technique (as webmarket suggested), the bug is not invoked, beacuse the page is assembled before the browser sees it.

...

I should point out that MCookie's original suggestion regarding @import has the advantage of being compliant, and will therefore validate, whereas <nolayer> doesn't validate (if you care about that sort of thing).