[thelist] hiding CSS

Duncan O'Neill dbaxo at ihug.co.nz
Mon Apr 15 21:42:11 CDT 2002


> An update from Duncan is in order, yes. Or maybe just a general
> description of the problem to which a solution is being sought.

warning : long spiel

Erik,

glad you asked... :-)

The general idea was to write the (personal) site so that I
could serve a basic text-formatting stylesheet to old browsers, and a
more complete page-formatting sheet to newer browsers.
Nothing new here; link to the sheet for old browsers, and
serve the page-formatting sheet to modern browsers using
@import "style.css"; to hide it from IE4.x and NN4.x .

Problem was, I recently got a Mac, and discovered that
Mac IE4.5 screwed up the stylesheet. Instead of busting
a gut to tweak the advanced sheet for the tiny Mac IE4.5
audience, I decided to hide the sheet from it.

How to do that? According to this page;
http://pixels.pixelpark.com/~koch/hide_css_from_browsers/summary/
using @import url("another_directory/style.css") hid the page from
all three browsers mentioned above. Perfect!

Or not? My version ('compatibility mode') of Win/IE4 was *reading*
the sheet linked as above. So I had to find out whether my version
of IE4 was behaving properly (i.e as does a 'true install' of IE4),
or whether the page above had it wrong. That was the reason
for the original post.

After much checking and fretting and posting, it turns out that IE4
in compatibility mode *was* mis-behaving. It acts
like IE5 with @import, *except* that it ignores @import "style.css",
and @import "another_directory/style.css";. But I could use
neither of these two because IE4.5/Mac would read the sheet.

So contrary to what my version was telling me, I *could* use
@import url("another_directory/style.css"); to hide the sheet
from *all three browsers*.

Problem solved. Except that, unless the local version was
different from the remote, or I messed around with the directories,
I wouldn't see the site as other IE4 users would. And I'm lazy. Not
to mention insecure.

So I settled on a slightly convoluted method of hiding the sheet
from all three;

in the html;
<link rel="stylesheet" type="text/css" href="basic.css" />
<style type="text/css" media="all">@import "advanced.css";</style>
<!-- hides sheet from IE4.x and NN4.x -->

"advanced.css" is one line;
@import url("advanced2/css"); /* hides sheet from MacIE4.5*/

To avoid doing all of this again, and in case anyone else is
interested, I made a page which goes into the detail of using
@import. It's nowhere near comprehensive, but it'll do for
now. Note the bizarre results for Mac Class IE4.01 in
reading sheets that Mac Classic IE4.5 doesn't. I can't check
this for myself, I'm relying on someone else.

http://members.evolt.org/dbo/tests/css_import.htm

fwiw, the site in question is linked below

hope this makes sense. cheers,

Duncan O'Neill
The Urban Legend magazine
http://homepages.ihug.co.nz/~dbaxo/urban_legend.htm
=============================================




More information about the thelist mailing list