HTML and CSS Reference
In-Depth Information
The
text-shadow
property is similar and specifies the horizontal and vertical offset as 2px. The blur
value is also set to 2px. Figure 13-12 shows the resulting box.
Figure 13-12.
Adding shadows to the box and the text
Note that
text-shadow
isn't supported in all browsers (IE9 for example), but
box-shadow
has good
support in all the leading browsers.
By default, a box shadow is placed outside the box. You can change this behavior using the
inset
keyword like this:
box-shadow: 5px 5px 5px #808080 inset;
When you add the
inset
keyword at the end, the shadow appears inside the box rather than outside
(Figure 13-13).
Figure 13-13.
Shadow after adding the
inset
keyword
