Assigning external CSS

Johannes Koch

unread,

Mar 20, 2003, 8:16:43 AM3/20/03

to

Hi,

inspired by Alan's 'webtv/msntv and CSS' thread, I made a new section on
our w3development.de site: "Assigning external CSS", which includes test
results for various mechanisms to assign external CSS to HTML documents
(link, @import, etc.).

Have a look at:
<http://w3development.de/css/assigning_external_css/>

As I have no access to a Mac, I could not yet include test results for
Mac browsers. So feel free to test on more browsers [1] and let us know
the results.

[1] The header columns (e.g. '<link media="all">') should be in a red,
italic font on white background, if the associated stylesheet is used.
--
Johannes Koch
In te domine speravi; non confundar in aeternum.
(Te Deum, 4th cent.)

Brian

unread,

Mar 20, 2003, 12:21:09 PM3/20/03

to

Johannes Koch wrote:
>
> <http://w3development.de/css/assigning_external_css/>
>
> As I have no access to a Mac, I could not yet include test results for
> Mac browsers. So feel free to test on more browsers [1] and let us know
> the results.
>
> [1] The header columns (e.g. '<link media="all">') should be in a red,
> italic font on white background, if the associated stylesheet is used.

Netscape 7.0/Mac results

link test
<link> <link media=all> <link media=screen> <link media=screen, foo>
in red italics

@media test
all screen screen, foo
in red italics

It appears to have passed.

--
Brian
follow the directions in my address to email me

Brian

unread,

Mar 20, 2003, 1:36:03 PM3/20/03

to

Johannes Koch wrote:
>
> <http://w3development.de/css/assigning_external_css/>
>
> As I have no access to a Mac, I could not yet include test results
> for Mac browsers. So feel free to test on more browsers [1] and let
> us know the results.
>
> [1] The header columns (e.g. '<link media="all">') should be in a
> red, italic font on white background, if the associated stylesheet
> is used.

IE 5.0/Mac

link test
<link> <link media=all> <link media=screen> <link media=screen, foo>
in red italics

@media test

no headers in red italics

[2] NB: I'm fairly certain that IE 5.1/Mac behaves differently
regarding @import; specifically, it does not recognize @import url("")

I don't have 5.1 to test here, but I had problems with this on a site
I am currently redesigning.

Johannes Koch

unread,

Mar 20, 2003, 5:23:35 PM3/20/03

to

Brian wrote:

[Test results for Mac Netscape 7.0]

I hope that for 'print' you will get red headers when viewing the print
preview (or print it).

As Netscape 7.0 is based on some Mozilla version, I expect it to behave
like other Mozillae.

--
Johannes Koch
In te domine speravi; non confundar in aeternum.

(Te Deum, 4th century)

Johannes Koch

unread,

Mar 20, 2003, 5:40:43 PM3/20/03

to

Brian wrote:
> <style> @import...all rule
> @import url() all @import url("") all
> in red italics

no '@import "" all'?

> <style> @import...screen rule
> @import url() screen @import url("") screen
> in red italics

no '@import "" screen'?

As with Netscape 7.0: what about print previews/printed documents?

Thanks for testing

--
Johannes Koch
In te domine speravi; non confundar in aeternum.

(Te Deum, 4th century)

Brian

unread,

Mar 21, 2003, 2:05:16 PM3/21/03

to

Johannes Koch wrote:
> Brian wrote:
>
> [Test results for Mac Netscape 7.0]
>
> I hope that for 'print' you will get red headers when viewing the print
> preview (or print it).

Yes, sorry, I didn't check that. The following are in red italics,
using print preview (I have no printer here):

link
<link> <link media="all"> <link media="print">

@media
@media all @ media print

style with @import
style @import style @import...all style @import...print
all red italics

style media=
style media="all" style media="print"
all headers in red italics

Brian

unread,

Mar 21, 2003, 2:59:44 PM3/21/03

to

Johannes Koch wrote:
>
>><style> @import...all rule
>>@import url() all @import url("") all
>>in red italics
>
> no '@import "" all'?

Just rechecked. No. Double quotes only work when no media is
specified. If media is specified, only url() and url("") work. And
with IE 5.1, I believe url("") does *not* work, but I don't have 5.1
here to check. I learned that while testing a site I was developing
on a library Mac with 5.1.

>><style> @import...screen rule
>>@import url() screen @import url("") screen
>>in red italics
>
> no '@import "" screen'?

No. Only the 2 I listed.

> As with Netscape 7.0: what about print previews/printed documents?

I can only test print preview.

@media
none in red italics, even in print preview

style @import
@import...""; @import url(); @import url(""); in red italics

style @import...all

@import url() all; @import url("") all; in red italics

style @import...print
@import url() print; @import url("") print; in red italics

Johannes Koch

unread,

Apr 7, 2003, 5:57:25 PM4/7/03

to

Johannes Koch wrote:
> Have a look at:
> <http://w3development.de/css/assigning_external_css/>

Any more browser test results? Maybe some more Mac IEs or Mac Opera?

--
Johannes Koch
In te domine speravi; non confundar in aeternum.

(Te Deum, 4th century)

Lauri Raittila

unread,

Apr 7, 2003, 7:35:02 PM4/7/03

to

In article <b6ssvs$8jodd$1...@ID-61067.news.dfncis.de>, Johannes Koch wrote:
> Johannes Koch wrote:
> > Have a look at:
> > <http://w3development.de/css/assigning_external_css/>

Good work. And I might even start remebering that url someday)

> Any more browser test results? Maybe some more Mac IEs or Mac Opera?

No, but some more stuff on win Opera. Maybe you should make operas
different modes as different browsers? (at least small screen mode, as it
is clearly distinct from normal.)

Opera 7.1b3 (IIRC since b2) supports media="handheld" in small screen
mode (shift+F11) in <link>

Doesn't small screen mode doesn't seem to effect with
http://w3development.de/css/assigning_external_css/at_media.html
but as table is linearised I'm not sure what happens.

In http://w3development.de/css/assigning_external_css/style.html
Normal mode doesn't take projection or handheld, but projection and small
screen mode take needed, but not screen

In http://w3development.de/css/assigning_external_css/style_media.html
media="handheld" is only used in small screen mode, and projection only
in projection mode. In projection mode or small screen mode, media=screen
is not used.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

Johannes Koch

unread,

Apr 8, 2003, 8:42:08 AM4/8/03

to

Hi Lauri,

Lauri Raittila wrote:
> In article <b6ssvs$8jodd$1...@ID-61067.news.dfncis.de>, Johannes Koch wrote:
>
>>Johannes Koch wrote:
>>
>>>Have a look at:
>>><http://w3development.de/css/assigning_external_css/>
>
>
> Good work. And I might even start remebering that url someday)

:-)

>>Any more browser test results? Maybe some more Mac IEs or Mac Opera?
>
>
> No, but some more stuff on win Opera. Maybe you should make operas
> different modes as different browsers? (at least small screen mode, as it
> is clearly distinct from normal.)

Good idea.

[Opera 7.1b3 results]

tnx for testing