Styling Text - Beginning CSS3 - page 64

.under {
text-decoration: underline;
-moz-text-decoration-color: red;
-moz-text-decoration-style: wavy;
text-decoration-color: red;
text-decoration-style: wavy;
}
Figure 4-10 shows how Firefox renders text-decoration css3.html .
Figure 4-10. CSS3 offers an increased range of options for text-decoration
When browsers fully support the CSS3 implementation of text-property , you'll be able to consolidate
the values for any combination of text-decoration-line , text-decoration-color , text-decoration-style ,
and text-decoration-skip into a single shorthand declaration. For example, the preceding under class can be
rewritten like this:
.under {
text-decoration: underline red wavy;
}
However, even when browsers start to support this CSS3 shorthand, you won't be able to use it if you want
your style to be rendered in older browsers. For the foreseeable future, you need to use the CSS2.1 version of
text-decoration followed by the individual CSS3 properties for cross-browser compatibility.
Indenting the First Line of Text
he text-indent property takes a length or a percentage and indents the first line of text in each block by the
amount specified. When the value is a percentage, the indentation is a percentage of the parent element's width.
Figure 4-11 shows what happens when you set text-indent for paragraphs to 40px (see text-indent.html ).