HTML and CSS Reference
In-Depth Information
Figure 8.6
border-radius
set independently
on each corner.
Web-based tools such as
http://borderradius.com/
provides an interac-
tive tool for setting the border dimensions and generating rules for
the various vendor extensions.
A rounded corner with
border-radius
does not require a border of any
dimension. Without a border, the background of the element will still be
rounded and cropped. When mixing border styles (
Figure 8.7
) and sizes,
browsers will do a best guess to smooth the transitions.
Figure 8.7
Example of mixed
border styles.
Outlines are a special visual property that behave similarly to borders
but take up no space in the layout. Outlines are used most often to show
focus on a link, active form field, or other element. They can also be