This will match any paragraph that is the first child of a DIV that immediately follows an H1 element. See Chapter 10, "CSS2: A Look Ahead", CSS2: A Look Ahead, for more details.

Figure 11-13

Figure 11-13. First-letter styling

Having set the article's body to the appearance we want, all that remains is to adjust the placement of the divisions so that the columns are of roughly equal length. We can do this now because

Monday 19th of March 2018 08:01:49 AM

CSS Style Guide

XHTML: What is XML?

XML (Extensible Markup Language) is a “super” markup language from which programmers can develop other, custom markup languages and specialized applications. XHTML (Extensible Hypertext Markup Language) is one such markup language.

Programmers already use XML for database and catalog work, and XML also acts as the foundation for standard web protocols including Scalable Vector Graphics (SVG), Synchronized Multimedia Integration Language (SMIL), Wireless Markup Language (WML), and Platform for Privacy Preferences (P3P).

For information about these web protocols, visit W3C.

« XHTML Section Index | XHTML Guidelines »

(<A CLASS="external" HREF="...">) to be silver, instead of medium gray. They'll still be a dark gray once they've been visited, of course, unless you add a special rule for that as well:

BODY {color: black;}
A:link {color: #808080;}      /* medium gray */
A.external:link  {color: #666666;}
A:active {color: silver;}
A:visited {color: #333333;}   /* a very dark gray */
paragraph" example would look if the background image failed to
load, as in Figure 6-26.

Figure 6-26

Figure 6-26. The consequences of a missing background image

Given this reason alone, it's always a good idea to specify a background color when using a background image, so that your white text will at least be visible:

P.starry {background-image: url(;
background-color: black; color: white;}placed, but for the moment, let's leave things as they are.

Actually, there is one more thing we should add. Here's the markup:

<DIV STYLE="float: right; width: 45%;">

This is the DIV for the second column. Why have we floated it as well? Assume for a moment that the second column is longer than the first. Without the float for the second column, we'd see amargins or padding, we'd get results such as that shown in Figure 8-57.

Figure 8-57

Figure 8-57. Inline borders and line-box layout

The borders are placed as they are because the border edge of inline elements is controlled by the font-size, not the line-height. In other words, if a SPAN element has a font-size of 12pt and a line-height of 36pt, its content area is 12pt