User Agent Support Notes for CSS Techniques

This page documents user agent support notes for CSS Techniques.

C12: Using percent for font sizes

When font size is specified in any absolute units of measurement, such as points or pixels, the Text Size menu commands in Internet Explorer 7 and earlier do not resize the text.

When High Contrast Mode has been set from the Accessibility Control Panel on Windows, IE6 increases the size of the page text as if a percentage change had been set for the outermost window via CSS. Standard CSS layout behavior causes relative scaling to be multiplied, so the scaling of text within elements will be different in subtle ways. Firefox and IE7 do not change the scaling of the content based on the system settings in a way that affects CSS layout, so this effect does not occur in those browsers.

C13: Using named font sizes

When font size is given in absolute units of measurement, such as points or pixels, the Text Size menu commands in Internet Explorer 7 and earlier do not resize the text.

C14: Using em units for font sizes

In Internet Explorer 6, using ems for font sizes will cause the text to grow more than using % or named font sizes. So, text-size/largest, might cause the text to grow more than 200% and have clipping problems.

When font size is given in absolute units of measurement, such as points or pixels, the Text Size menu commands in Internet Explorer 7 and earlier do not resize the text.

Internet Explorer 7 only changes the text size when the style rule that applies to the text is defined within a style element; when using inline styles, that is, using an element's style attribute, the text size change is not supported.

C15: Using CSS to change the presentation of a user interface component when it receives focus

Internet Explorer 6.0 and earlier versions for Windows do not support dynamic pseudo-classes for any elements except hyperlinks. Internet Explorer 7 does not support :focus styles for elements other than hyperlinks. Include the :active CSS pseudo class to achieve the same effect as :focus in Internet Explorer for (X)HTML links (a element).

Firefox 1.5, Firefox 2.0 and SeaMonkey 1.1 for Windows support dynamic pseudo-classes for text input fields, text areas, radio buttons, check boxes, select elements, submit/reset buttons, and button elements. However, setting different colors or borders when a radio button or a check box receives focus is not supported.

Opera 9.02 for Windows supports dynamic pseudo-classes for text input fields, text areas, radio buttons, check boxes, select elements, submit/reset buttons, but not for button elements.

Firefox 2.0, Opera 9.02 and SeaMonkey 1.1 for Windows also support adjacent sibling selectors for form labels. Firefox 1.5, Internet Explorer 6.0 and earlier versions for Windows do not support adjacent sibling selectors for form labels.

C18: Using CSS margin and padding rules instead of spacer images for layout design

On the Microsoft Windows platform, Internet Explorer 5, Internet Explorer 5.5, Internet Explorer 6.0 in "quirks mode" and Internet Explorer 7 in "quirks mode" use a box model that deviates from the W3C CSS specification: in these browser versions, right and left padding, and right and left borders do not increase the total width of an element, so the space for the content inside such an element will be narrower. (This behavior is known as the "box model bug".) Internet Explorer 5.5 on Mac OS, and Internet Explorer 6 and 7 on Windows in "standards compliant mode" use the box model defined in the W3C CSS specification.

C23: Specifying text and background colors of secondary content such as banners, features and navigation in CSS while not specifying text and background colors of the main content

Most browsers allow the user to change the color settings to override the Web page's CSS and HTML color schemes. This is supported by all versions of Internet Explorer, Firefox, Mozilla, Netscape, and Opera after version 6.

When specified colors are overridden in Netscape and versions of Firefox before Firefox 3.0, most Javascript pop-up boxes and drop-down menus become unusable. Pop-up boxes gain a transparent background, superimposing the text of the box on the text of the page, and drop-down menus either become transparent or gain a dark-grey background.

Internet Explorer 6 will not override background colors unless the same background color has also been selected in the system settings.

There are no color settings in Safari so it is not possible to over-ride specified colors. Similarly where colors are not specified Safari displays the page in black text on a white background, ignoring any color preferences from within the system settings.

C25: Specifying borders and layout in CSS to delineate areas of a Web page while not specifying text and text-background colors

Most browsers allow the user to change the color settings to override Web author's CSS and HTML color schemes. This includes IE, all versions of Firefox, Mozilla, and Opera after version 6.

When specified colors are overridden in Netscape and versions of Firefox before Firefox 3.0, most Javascript pop-up boxes and drop-down menus become unusable. Pop-up boxes gain a transparent background, superimposing the text of the box on the text of the page, and drop-down menus either become transparent or gain a dark-grey background.

IE 6 will not override background colors in the browser unless the same background color has also been selected in the system settings.

There are no color settings in Safari so it is not possible to over-ride specified colors. Similarly where colors are not specified Safari displays the page in black text on a white background, ignoring any color preferences from within the system settings.

C28: Specifying the size of text containers using em units

In Internet Explorer 6, Windows High Contrast Mode will resize percent-based fonts in nested tables to be too large. Firefox and later versions of IE do not resize fonts in High Contrast Mode, and don't have this issue.