Support for Cascading Style Sheets, Level 1
in
Microsoft Internet Explorer 3.0,
Win32 version
Purpose
The information on this page is intended as reference material for
persons authoring pages with
Cascading
Style Sheets with the intention of making them viewable in
Microsoft
Internet Explorer 3.0. This page addresses the Windows 95/NT
version of Internet Explorer. For similar information which addresses the
Macintosh version, see
Eric
Meyer's page.
Notes on this revision
This is the first revision I've made to this page since I totally
overhauled it with the new format. Here is a summary of the changes since
the last revision:
- Section
3 ("The Cascade") has been expanded slightly.
- Section
5.1.1 (the
font-family
property) incorrectly stated
that Internet Explorer does not support the generic family names cursive
and fantasy. Internet Explorer does in fact support these.
- Section
5.1.1 (the
font-family
property) has been expanded
slightly to further address parsing issues with alternate font lists.
- The description of Internet Explorer's problems with the
background
property and linked style sheets has been expanded.(5.2.7)
- Section
6.3 ("Color Units") incorrectly stated that Internet
Explorer did not support the 3-digit hexadecimal format for specifying
color. Internet Explorer does in fact support this.
This document attempts to reflect the state of the most recent release
version of Internet Explorer, which, as of this revision, is version
3.02a. Its entire contents may not be applicable to previous versions of
Internet Explorer 3.0.
Acknowledgements
Thanks to these persons for contributing ideas and information to this
page.
- 1
Basic concepts
- 2
Pseudo-classes and pseudo-elements
- 3
The cascade
- 4
Formatting model
- 5
Properties
- 5.1
Font properties
- 5.2
Color and background properties
- 5.3
Text properties
- 5.4
Box properties
- 5.5
Classification properties
- 6 Units
- 6.1
Length units
- 6.2
Percentage units
- 6.3
Color units
- 6.4 URL
Lack of support for a number of CSS features limits the amount of "cascading"
required of Internet Explorer.
- Importing style sheets with
@import
is not supported.
- The special attribute
important
is not supported.
- Internet Explorer has no documented means of specifying a user style
sheet.
In addition to these deficiencies, Internet Explorer 3.0 seems
altogether incapable of cascading. For instance, it will not combine (and
duly cascade) styles included in either multiple STYLE
blocks, or a combination of a linked style sheet and one or more STYLE
blocks.
Internet Explorer 3.01 (and presumably any subsequent versions of
Internet Explorer 3.0) uses a simplified version of the
CSS1
formatting model which lacks borders and padding. Further departures
from the CSS1 formatting model (as they relate to specific properties) are
noted in sections 5.2.7,
5.3.8,
and 5.4.5.
In versions of Internet Explorer 3.0 prior to version 3.01,
margins are not inherited. In those versions, margins values are always
interpreted relative to the canvas, and not relative to any margin for any
parent element.
Supported: |
yes |
Supported values: |
<family-name> | serif | sans-serif
| monospace | cursive | fantasy |
Unsupported values: |
[[<family-name> | <generic-family>],]* [<family-name>
| <generic-family>] |
Unsupported syntax: |
|
Rendering errors: |
none |
Supported: |
yes |
Supported Values: |
normal | italic |
Unsupported Values: |
oblique |
Unsupported syntax: |
none |
Rendering errors: |
none |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
yes |
Supported Values: |
normal | bold |
Unsupported Values: |
bolder | lighter | 100 |
200 | 300 | 400 | 500
| 600 | 700 | 800 | 900 |
Unsupported syntax: |
none |
Rendering errors: |
none |
Supported: |
yes |
Supported Values: |
xx-small | x-small | small
| medium | large | x-large |
xx-large | <length> | <percentage> |
Unsupported Values: |
smaller | larger |
Unsupported syntax: |
none |
Rendering errors: |
Percentage values are not applied correctly. Percentage should be
based exclusively on the font size of the parent element. Internet
Explorer calculates size based on the percentage of whatever the
default font size for the element is. A couple of examples:
-
Given the style:
H1 { font-size: 100% }
Text in the H1 element should be the same size as
the BODY text. However, Internet Explorer interprets
this as 100% of the default size of the H1 element;
or, no change at all.
-
Given the style:
SUP { font-size: 70% }
Text in the SUP element should be 70% of the size
of text in the parent element. However, Internet Explorer scales
the text in the SUP element down by default, based
on the parent element. Internet Explorer applies this style to
size text in the SUP element 70% of the already
smaller size.
|
Supported: |
yes |
Supported Values: |
<color> |
Unsupported Values: |
none |
Unsupported syntax: |
none |
Rendering errors: |
none |
Supported: |
no |
Supported Values*: |
<color> |
Unsupported Values*: |
none |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
* Included as it pertains to the background
property (5.2.7).
Supported: |
no |
Supported Values*: |
<URL> |
Unsupported Values*: |
none |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
* Included as it pertains to the background
property (5.2.7).
Supported: |
no |
Supported Values*: |
repeat | no-repeat | repeat-x
| repeat-y |
Unsupported Values*: |
none |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
* Included as it pertains to the background
property (5.2.7).
Supported: |
no |
Supported Values*: |
scroll | fixed |
Unsupported Values*: |
none |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
* Included as it pertains to the background
property (5.2.7).
Supported: |
no |
Supported Values*: |
[top | center | bottom | <percentage>]
|| [left | center | right | <percentage>] |
Unsupported Values*: |
<length> || <length> |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
* Included as it pertains to the background
property (5.2.7).
Supported: |
yes |
Supported Values: |
<background-color> || <background-image>
|| <background-repeat> || <background-attachment>
|| <background-position> |
Unsupported Values: |
see section 5.2.6 |
Unsupported syntax: |
This property is not applied to the BODY element when
used from a linked style sheet. |
Rendering errors: |
-
Per the CSS1 specification, the default background for an
element should be transparent, allowing the background of the
parent element to "show through." This is not applied
consistently in Internet Explorer: while all elements appear to
show the background of the BODY element by default,
this is not applied to parent-child relationships of other
elements in the document. For example, given the styles:
DIV { background: black }
H1 { color: white }
... And the HTML code:
<DIV>
<H1>peas porridge hot</H1>
</DIV>
The text peas porridge hot should be white on a
black background.
- Backgrounds are not applied correctly to elements, save the
BODY , TD , and TH elements.
Per the CSS1 specification, an element's background should be
applied to the entire "box" of the element, plus any
padding and border (unless the border has its own color). Internet
Explorer applies the background only behind text.
- Values for background position are applied only to the
BODY
element.
- Background images aligned along the bottom align with the bottom
of text on the page, rather than the bottom of the browser window.
- Background images aligned along the right of the page align with
the rightmost margin of text on the page, rather than the right side
of the browser window.
|
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
yes |
Supported Values: |
none | underline | line-through |
Unsupported Values: |
overline | blink | <combinations of
two or more values> |
Unsupported syntax: |
n/a |
Rendering errors: |
none |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
yes |
Supported Values: |
left | right | center |
Unsupported Values: |
justify |
Unsupported syntax: |
none |
Rendering errors: |
none |
Supported: |
yes |
Supported Values: |
<length> | <percentage> |
Unsupported Values: |
none |
Unsupported syntax: |
none |
Rendering errors: |
none |
Supported: |
yes |
Supported Values: |
<length> | <percentage> |
Unsupported Values: |
normal | <number> |
Unsupported syntax: |
n/a |
Rendering errors: |
- Values are incorrectly applied to the top and bottom of a text
block.
- Negative length values are rendered, rather than ignored; CSS1
does not allow negative values for this property.
|
Supported: |
yes |
Supported Values: |
<length> | <percentage> |
Unsupported Values: |
auto |
Unsupported syntax: |
none |
Rendering errors: |
see section 5.4.5 |
Supported: |
yes |
Supported Values: |
<length> | <percentage> |
Unsupported Values: |
auto |
Unsupported syntax: |
none |
Rendering errors: |
see section 5.4.5 |
Supported: |
yes |
Supported Values: |
<length> | <percentage> |
Unsupported Values: |
auto |
Unsupported syntax: |
none |
Rendering errors: |
none |
Supported: |
yes |
Supported Values: |
<length> | <percentage> |
Unsupported Values: |
auto |
Unsupported syntax: |
none |
Rendering errors: |
none |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported: |
no |
Supported Values: |
n/a |
Unsupported Values: |
n/a |
Unsupported syntax: |
n/a |
Rendering errors: |
n/a |
Supported units: |
|
Unsupported units: |
|
Percentage units are supported as described in the CSS1 specification.
Supported notation: |
- <six-digit RGB hexadecimal>
- <three-digit RGB hexadecimal>
|
Unsupported notation: |
- <functional, using integers>
- <functional, using percent>
|
Internet Explorer supports the functional notation for URLs described in
the CSS1 specification, with the following exceptions:
- Full URLs (of the form http://www.foobar.com/image.gif)
are not supported, though relative URLs work fine.
- Use of the optional single or double quotes to enclose the URL string
is not supported.