HTML and CSS Reference
supporting browsers recognize overflow-wrap , you should use word-wrap , which both modern browsers and
Internet Explorer versions 6, 7, and 8 support.
The initial value of normal means lines of text may break only between words. Usually, this is fine, but if a word is
longer than the element it is contained within, it will overflow rather than break, as shown in Figure 11-9. Where this
effect is undesirable, you can use the value break-word to force a word to break and wrap onto a new line instead,
also shown in Figure 11.9.
Figure 11-9 The difference between word-wrap: normal; and word-wrap: break-word.
Code Challenge: Change the Style of Various Text Elements
In styles.css, do the following:
1. Add a new rule set for a.button:link below the .button rule set with the declarations text-
transform: uppercase; text-decoration: none; .
2. Add the declarations text-transform: uppercase; text-decoration: none; to the
#header nav ul li a rule set.
Project files update (ch11-02): If you haven't followed the previous instructions and are comfortable working from
here onward or would like to reference the project files up to this point, you can download them from
A list, such as the unordered list of benefits under “Why Choose Cool Shoes & Socks?”, is made up of text as well
as a marker such as a bullet point. Using CSS, you can change the type of marker used and change its position.
Initial value: disc | Inherited: Yes | Applies to: Elements with display: list-item | CSS2.1
Browser support: IE 4+, Firefox 1+, Chrome 1+, Opera 3.5+, Safari 1+