CSS support in MS IE 3.0
Microsoft released Internet
Explorer 3.0 on August 14, 1996. It is the first commercial browser that supports
CSS. This is a major step forward for style sheets on the web.
This page contains pointers to sample documents and points out some
remaining holes in the CSS implementation. The latter will be useful
for people who want to start writing style sheets.
- While CSS1 can't encode the full typography of Wired (the paper version, that is),
it still deserves a mock front page. Note that
the SPAN elements in the WIRED banner have images as backgrounds. CSS1
has not been designed as a too for graphics artists, and the lack of
per-pixel control is starting to show in this example.
- Also, advertisements are a source of information. The IBM ad reproduced here was printed in WIRED
4.05 US. Compared to the paper version, the CSS-encoded page contains
more white space around the word "gazillion". This is due to MS IE not
supporting negative margins in CSS. The CSS specification
is still unclear on this issue (as of June 96).
The tree documents below all contain exactly the same HTML markup. The
only thing that changes is the style sheet. Viewed through a CSS-aware
browser, the resulting presentations are quite different.
CSS implementation holes
While MSIE3 can claim support for CSS, there are bugs and
limitations. Below you will find prioritized lists of missing
functionality and bugs. Braden N. McDaniel has also published his list of holes.
- em values (i.e. length units relative to a font size) are
not supported. This is important in order to write style sheets that
scale from one resolution to another.
- There is no documented way for users to supply their personal style sheets.
- 'margin' (the compound property) and 'margin-bottom' are not supported
- the 'padding' properties are not supported
- the 'border' properties are not supported
- pseudo-elements are not supported (but pseudo-classes are!)
- The formatting model as implemented in beta 1 diverges from the
specification. E.g., the left margins of the
BODY and P elements do not add up (example).
- Margins do not collapse as described in the specification. Take a
look at the Style Sheets resource page which has
a style sheet attached. In order for all lists to be aligned, they are
all within an explicit P element. In the case where the P element only
has children elements (i.e. UL and LI), the margins belonging to the P
element should be collapsed (i.e. take the maximum of) with
'margin-bottom' of the above element (H2) and 'margin-top' of the
child element (UL). Since this is not the case (all margins seem to be
added), the space between the H2 and the UL element becomes too large.
- 'font-family' declarations must be placed at the end of blocks;
they seem to hide trailing declarations (example)
- You cannot set styles on implied tags. For example, if you don't
include the BODY tag in your documents, style attached to the BODY
element will not have any effect
- Line spacing (as shown in this example)
is also added to the last line of a formatted element -- that's why
there is so much space around the headlines. Spacing should
only be added between lines.
- vertical spacing sometimes act weird after lists. Consider the
space between the end of the list and the horizontal rule in this example
- inline elements do not inherit the background of their parents
correctly. Consider this example where the SPAN
element inside the H1 takes the background of BODY, not H1.
- lines with links in them sometimes get extra space above them
Last updated September 1, 1996