Monday, October 4, 2010

Css Tutorial : border-width

border-width
More specifically, in this section we will look at border-width, border-top-width, border-rightwidth,
border-bottom-width, and border-left-width. These properties allow you to define the
width of the element’s edges one by one or all at once. Note that for a border-width value to be
applied, a border-style must first be declared.
Several keyword values are available here, as well as relative lengths. The keywords are
thin, medium, and thick, although caution is required as different browsers render these borders

in various ways. Exactly how many pixels each browser will use does vary. Note that if you
define a border-style but not a border-width, the default value is medium.
In the following example, the border-style values declared previously are combined with
specific border-width keywords and relative values:
/* Container for centering all our content */
#container {
width: 400px;
margin: 10px auto 10px auto;
padding: 20px;
border-style: dashed dotted solid ridge;
border-top-width: thin;
border-right-width: 20px;
border-bottom-width: medium;
border-left-width: thick;
}

No comments:

Post a Comment