Handheld media test 2

A link element with a media="handheld" attribute that specifies a stylesheet with an @import rule that imports a stylesheet with simple element selectors in turn. Headings should only appear right aligned and teal in handheld media user agents, not in screen, print, projection or other media modes.

Media dependent style sheet test case summaries

Follow the down-page links below for detailed case summaries for each of the browsers tested. Document link markup and CSS is listed in the View source section at the foot of the page, with links to other test pages in this set.

Internet Explorer:
Windows: [ 7.0 ] [ 6.0 ] [ 5.5 ] [ 5.0 ] [ 4.0 ] [ 3.0 ] Mac: [ 5.0 ] [ 4.5 ] [ 4.01 ]
Netscape Navigator:
Windows: [ 7.1 ] [ 6.0 ] [ 4.73 ] Mac: [ 4.7 ]
Opera:
Windows: [ 7.11 ] [ 6.01 ] [ 5.11 ] [ 5.0 ] [ 4.0 ] [ 3.62 ]
Safari:
Mac: [ 1.2 ]

Internet Explorer 7.0 for Windows

Internet Explorer 7.0 for Windows correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen and print are specifically supported, and all other media dependent styles are correctly disregarded.

Internet Explorer 7.0 for Windows recognises @import rules and correctly renders stylesheets attached in this way according to any media attribute in the referring document's link element.

Internet Explorer 6.0 for Windows

Internet Explorer 6.0 for Windows correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen and print are specifically supported, and all other media dependent styles are correctly disregarded.

Internet Explorer 6.0 for Windows recognises @import rules and correctly renders stylesheets attached in this way according to any media attribute in the referring document's link element. This test case demonstrates an improvement in media dependent stylesheet conformance compared with Internet Explorer 5.5 for Windows.

Internet Explorer 5.5 for Windows

Internet Explorer 5.5 correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen and print are specifically supported, and all other media dependent styles are correctly disregarded.

Internet Explorer 5.5 recognises @import rules but does not fully maintain media dependency according to any media attribute in the referring document's link element. For media types all and screen this browser appears to conform to the CSS2 specification on screen and when printing. All other media dependent styles are incorrectly rendered on screen using this form of stylesheet attachment, but media specific styles are correctly applied in print (only print media styles are printed).

Of all the cases in which media dependent link elements are combined with imported stylesheets, general behaviour suggests that only document printing conforms to CSS2 media specificity in Internet Explorer 5.5 and screen display may not. In the case of all and screen media styles, this apparently faulty behaviour cannot be distinguished from proper CSS2 conformance.

Internet Explorer 5.0 for Windows

Internet Explorer 5.0 for Windows correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen and print are specifically supported, and all other media dependent styles are correctly disregarded.

Internet Explorer 5.0 for Windows recognises @import rules but does not fully maintain media dependency according to any media attribute in the referring document's link element. For media types all and screen this browser appears to conform to the CSS2 specification on screen and when printing. All other media dependent styles are incorrectly rendered on screen using this form of stylesheet attachment, but media specific styles are correctly applied in print (only print media styles are printed).

Of all the cases in which media dependent link elements are combined with imported stylesheets, general behaviour suggests that only document printing conforms to CSS2 media specificity in Internet Explorer 5.0 and screen display may not. In the case of all and screen media styles, this apparently faulty behaviour cannot be distinguished from proper CSS2 conformance.

Internet Explorer 5.0 for Mac

Internet Explorer 5.0 for Mac recognises @import rules and correctly renders stylesheets attached in this way according to any media attribute in the referring document's link element.

Internet Explorer 4.5 for Mac

Internet Explorer 4.5 for Mac recognises @import rules and correctly renders stylesheets attached in this way according to any media attribute in the referring document's link element.

Internet Explorer 4.01 for Mac

Internet Explorer 4.01 for Mac may crash when it encounters @import rules. Unless the path to the imported stylesheet is specified explicitly, it is requested with a path relative to the source document, not the primary stylesheet. A 404, not found, error document served in place of a stylesheet will crash this browser and may freeze the operating system.

The indiscriminate handling of media dependent link elements is also carried over to imported stylesheets. For media type all, this gives the appearance of conforming to the CSS2 specification, but for the wrong reasons. The same is the case with screen media styles in screen mode and print media styles when printing, but all other media dependent styles are incorrectly rendered in all cases.

Internet Explorer 4.0 for Windows

Internet Explorer 4.0 correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen and print are specifically supported, and all other media dependent styles are correctly disregarded.

Internet Explorer 4.0 recognises @import rules but does not correctly maintain media dependency with stylesheets attached in this way according to any media attribute in the referring document's link element. For media type all, this gives the appearance of conforming to the CSS2 specification, but for the wrong reasons. The same is the case with screen media styles in screen mode and print media styles when printing, but all other media dependent styles are incorrectly rendered in all cases.

Comparison with test case 1 for any un-supported media suggests that the unqualified @import rule nullifies basic support for media attributes in link elements, cf. Embossed media test 1.

Internet Explorer 3.0 for Windows

Internet Explorer 3.0 does not discriminate link elements with media attributes and renders media dependent styles in standard screen mode and when printing. For media type all, this gives the appearance of conforming to the CSS2 specification, but for the wrong reasons. The same is the case with screen media styles in screen mode and print media styles when printing, but all other media dependent styles are incorrectly rendered in all cases.

Internet Explorer 3.0 does not recognise @import rules and will not load any stylesheets attached in this way, regardless of any media attribute in the referring document's link element. For all un-supported media types, this gives the appearance of conforming to the CSS2 specifications, though for the wrong reasons. Any all, screen and print media styles attached via @import rules are also effectively hidden from this browser.

Netscape Navigator 7.1 for Windows

Netscape 7.1 correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen and print are specifically supported, and all other media dependent styles are correctly disregarded.

Netscape Navigator 7.1 recognises @import rules and correctly renders stylesheets attached in this way according to any media attribute in the referring document's link element.

Netscape Navigator 6.0 for Windows

Netscape 6.0 correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen and print are specifically supported, and all other media dependent styles are correctly disregarded.

Netscape Navigator 6.0 recognises @import rules and correctly renders stylesheets attached in this way according to any media attribute in the referring document's link element.

Netscape Navigator 4.73 for Windows

Netscape Navigator 4.73 for Windows renders only link elements with the media attribute screen in standard screen mode, but screen media styles are also incorrectly rendered in print. Media type print is not supported and all other media dependent styles are correctly disregarded.

Netscape Navigator 4.73 for Windows does not recognise @import rules and will not load any stylesheets attached in this way, regardless of any media attribute in the referring document's link element. For all un-supported media types, this gives the appearance of conforming to the CSS2 specifications, though for the wrong reasons. Any all, screen and print media styles attached via @import rules are also effectively hidden from this browser.

Netscape Navigator 4.7 for Mac

Netscape Navigator 4.7 for Mac renders only link elements with the media attribute screen in standard screen mode, but screen media styles are also incorrectly rendered in print. Media type print is not supported and all other media dependent styles are correctly disregarded.

Netscape Navigator 4.7 for Mac does not recognise @import rules and will not load any stylesheets attached in this way, regardless of any media attribute in the referring document's link element. For all un-supported media types, this gives the appearance of conforming to the CSS2 specifications, though for the wrong reasons. Any all, screen and print media styles attached via @import rules are also effectively hidden from this browser.

Opera 7.11 for Windows

Opera 7.11 correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen, print and projection are specifically supported, and all other media dependent styles are correctly disregarded.

Opera 7.11 recognises @import rules and correctly maintains media dependency according to any media attribute in the referring document's link element.

Opera 6.01 for Windows

Opera 6.01 correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen, print and projection are specifically supported, and all other media dependent styles are correctly disregarded.

Opera 6.01 recognises @import rules but does not correctly maintain media dependency with stylesheets attached in this way according to any media attribute in the referring document's link element. For media type all, this gives the appearance of conforming to the CSS2 specification, but for the wrong reasons. The same is the case with screen media styles in screen mode and print media styles when printing, but all other media dependent styles are incorrectly rendered in all cases.

Comparison with test case 1 for any un-supported media suggests that the unqualified @import rule nullifies basic support for media attributes in link elements, cf. Embossed media test 1.

Opera 5.11 for Windows

Opera 5.11 correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen, print and projection are specifically supported, and all other media dependent styles are correctly disregarded.

Opera 5.11 recognises @import rules but does not correctly maintain media dependency with stylesheets attached in this way according to any media attribute in the referring document's link element. For media type all, this gives the appearance of conforming to the CSS2 specification, but for the wrong reasons. The same is the case with screen media styles in screen mode and print media styles when printing, but all other media dependent styles are incorrectly rendered in all cases.

Comparison with test case 1 for any un-supported media suggests that the unqualified @import rule nullifies basic support for media attributes in link elements, cf. Embossed media test 1.

Opera 5.0 for Windows

Opera 5.0 correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen, print and projection are specifically supported, and all other media dependent styles are correctly disregarded.

Opera 5.0 recognises @import rules but does not correctly maintain media dependency with stylesheets attached in this way according to any media attribute in the referring document's link element. For media type all, this gives the appearance of conforming to the CSS2 specification, but for the wrong reasons. The same is the case with screen media styles in screen mode and print media styles when printing, but all other media dependent styles are incorrectly rendered in all cases.

Comparison with test case 1 for any un-supported media suggests that the unqualified @import rule nullifies basic support for media attributes in link elements, cf. Embossed media test 1.

Opera 4.0 for Windows

Opera 4.0 correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen, print and projection are specifically supported, and all other media dependent styles are correctly disregarded.

Opera 4.0 recognises @import rules but does not correctly maintain media dependency with stylesheets attached in this way according to any media attribute in the referring document's link element. For media type all, this gives the appearance of conforming to the CSS2 specification, but for the wrong reasons. The same is the case with screen media styles in screen mode and print media styles when printing, but all other media dependent styles are incorrectly rendered in all cases.

Comparison with test case 1 for any un-supported media suggests that the unqualified @import rule nullifies basic support for media attributes in link elements, cf. Embossed media test 1.

Opera 3.62 for Windows

Opera 3.62 correctly applies link stylesheets with media attributes in standard screen mode and in print for all media types. Media types all, screen and print are specifically supported, and all other media dependent styles are correctly disregarded.

Opera 3.62 recognises @import rules but does not correctly maintain media dependency with stylesheets attached in this way according to any media attribute in the referring document's link element. For media type all, this gives the appearance of conforming to the CSS2 specification, but for the wrong reasons. The same is the case with screen media styles in screen mode and print media styles when printing, but all other media dependent styles are incorrectly rendered in all cases.

Comparison with test case 1 for any un-supported media suggests that the unqualified @import rule nullifies basic support for media attributes in link elements, cf. Embossed media test 1.

Safari 1.2 for Mac

Safari 1.2 correctly applies link stylesheets with media attributes in standard screen mode for all media types. Media types all, screen and print are specifically supported, and all other media dependent styles are correctly disregarded.

Safari 1.2 recognises @import rules and correctly renders stylesheets attached in this way according to any media attribute in the referring document's link element.

View source

XHTML link element

<link
 rel="stylesheet"
 type="text/css"
 href="/styles/test/media/handheld-Test2.1.css"
 media="handheld" />
    

Stylesheet: handheld-Test2.1.css

@import url(handheld-Test2.2.css);    

Stylesheet: handheld-Test2.2.css

H1{
  text-align: right;
  color: teal;
  background: white;
}
H2{
  text-align: right;
  color: teal;
  background: white;
}
H3{
  text-align: right;
  color: teal;
  background: white;
}    

CSS handheld media test pages

Copyright © 2000-2008 Philip Shaw, all rights reserved, terms and conditions apply.
Valid XHTML and correct CSS. Last updated 05 July 2008 at 14:58:19 PM BST.
http://www.codestyle.org/css/media/handheld-Test2.shtml Metadata: RDF