9
Border and Box effects
The ability to add borders to page elements
has been around, almost unchanged, since
the days of CSS1. What developers wanted
to do with borders, however, outstripped what
they could do with them years ago. Adding bordereffects like rounded corners or shadows has probably
been responsible for more extraneous empty markup elements than almost
anything else in the web development world. Things that should have been
simple often involved some incredibly complex workarounds.
The second part of our look at the Backgrounds and Borders Module
explores new methods of decorating elements without extra markup. You’ll
learn how to make rounded corners, use images for borders, and add drop
shadows.Giving Your Borders Rounded Corners
Since the earliest days of the Web, designers have been putting rounded
corners on page elements. That they’ve had no way to create them with-
out using images seems crazy. To create a box of flexible width with fourPX3024