SELECTORS - CSS: Professional Techniques for Modern Layout - page 44

h e end result is medium-size Verdana (or other sans-serif if Verdana is not available) text
with normal weight. h e boldfacing is gone (see Figure 2-4).

h e reason is that when you leave of bits of a shorthand property's value, the missing bits are
i lled in with the default values of the corresponding properties. h erefore, by leaving of the
values for the font's weight, style, and variant, you're saying:

strong { font : normal normal normal small/normal Verdana, sans-serif ;}

Yes, even the line-height is i lled in with its default, which can override any inherited
value for the line's height.

46

Figure 2-4: Un-bolding by mistake.

h is can become a problem if you aren't careful about how you set up your styles. Consider
the following two rules, the i rst coming from a sitewide style sheet and the second from a
page's embedded styles.

body { background : #FCC url(/i/pagebg.gif) 10px 25% no-repeat fixed ;}
body { background : url(i/body-bg.gif) ;}

Given those two rules, the page in question will have a new image tiled all over the back-
ground starting from the top let that scrolls when the page is scrolled. h at's because the
second rule shown is exactly equivalent to saying:

body { background : transparent url() 0 0 repeat scroll ;}

Now, if you wanted to have that happen, then this is the way to go. It's more likely that the
goal was to swap out one image for another. In that case, you just want to set the specii c
property, like so:

body { background-image : url(i/body-bg.gif) ;}