Boxing with CSS, Part II: No Margin For Error - HTML with Style | WebReference

Boxing with CSS, Part II: No Margin For Error - HTML with Style

Front Page1234567

Boxing with CSS, Part II: No Margin For Error

In tutorial 9, I gave an introduction to the CSS Visual Formatting Model. I explained how elements create boxes and how these should be rendered by browsers supporting CSS. That's all good and well, of course, until we actually get to talking about how the browsers that claim to support CSS actually do things. This is my job this week.

We'll start off gently by looking at the properties that control box borders in CSS, and see which of these are supported by the browsers. We'll then go on to explain the basics of how Internet Explorer handles the parts of the formatting model we've discussed so far. Then we take a deep dive into Netscape waters as we see that Netscape doesn't really support the formatting model at all, but merely interprets the properties in its own way.

Contents of this TutorialPage
1.Draw Your Borders1
Border Width Properties1
Border Color Properties1
Border Style Properties1
Border Shorthand Properties2
2.Fencing in the Beasts3
Using Border Properties in Navigator3
Using Border Properties in Internet Explorer3
3.Exploring the Box Ocean in Explorer4
The Border-Defying Body4
When Padding Collapses4
4.Navigating the Box Jungle in Navigator6
The Invincible BODY Margin6
The Swiss Cheese Background6
The Invisible Padding6
The Jagged Edge6
Explorer Challenge7
Netscape Coloring7

Off we go then, with a discussion of border properties

Front Page1234567

Produced by Stephanos Piperoglou

All Rights Reserved. Legal Notices.

Created: Dec 2, 1998
Revised: Jan 27, 1999