Cascading Style Sheets: The Definitive Guide

Chapter 8. Visual Formatting

In the previous chapter, we covered a great deal of information on how CSS handles the visual formatting of a document. However, we did this in a mostly practical fashion: lots of explanation about how things work, with only a little lip service paid to the questions of why. In this chapter, we turn to the theoretical side of visual rendering, with only occasional references to the practical.

You may wonder why it’s necessary to spend an entire chapter on the theoretical underpinnings of visual rendering in CSS. The main reason is to cover all the bases. I attempted to provide as many and varied examples as possible in the previous chapters, but with a model as open and powerful as that contained within CSS, no book could hope to cover every possible way of combining properties and effects. Every reader of this book will obviously go on to discover new ways of using CSS for their own document effects.

In the course of so doing, you may encounter what seems like strange behavior on the part of user agents. With a thorough grasp of how the visual rendering model works in CSS, you’ll be able to determine whether the behavior is a correct (if unexpected) consequence of the rendering engine CSS defines or whether you’ve stumbled across a bug that needs to be reported. (See Appendix A, for details on how to report problems with rendering engines.)

Basic Boxes

In the rendering of elements, CSS assumes that every element generates one or more rectangular boxes, ...