Creating a Print Style Sheet - Beginning CSS3 - page 368

Figure 16-2. Setting box-decoration-break to clone styles the fragments independently (simulation)

■ The box-decoration-break property is also designed to work with inline elements broken over more than
one line. So far, Opera is the only browser with partial support for this property. it treats broken inline elements as
separate fragments, preserving the background and border characteristics, but not padding. For more details about
box-decoration-break , see www.w3.org/TR/css3-background/#the-box-decoration-break .

Note

Creating Styles for Printing
There are two approaches you can take to creating styles for printing. You can start from scratch with a separate
set of print style rules. The other approach is to use the CSS cascade to override specific rules.
Neither approach is inherently better than the other. Which you choose depends on the site and the amount
of changes needed for the printed version. For example, a site that predominantly consists of text might need only
a few changes, so using the cascade to override the choice of fonts and color is all you need. On the other hand,
a site that uses a lot of background images, floats, and positioned elements is probably much easier to handle by
creating a dedicated print style sheet from scratch.

Using the Cascade for Print Styles
For a relatively small number of changes to the way a page is styled when printed, you can create a general style
sheet, and then override selected styles for printing. Because of the way the cascade works, the print style sheet
must be attached after the main style sheet. Omit the media attribute from the main style sheet, but specify it for
the print one like this:

<link href="styles/main.css" rel="stylesheet">
<link href="styles/print.css" rel="stylesheet" media="print" >