border Setting Four Borders in one

Using border and the border-top, border-right, border-bottom, and border-left properties
allows you to further shorten the given border-style and border-width and border-color
values into one property. Let’s look at an example of this shorthand.
Using the CSS from the previous example, again the same border-color, border-style,
and border-width values are assigned in that order:
/* Container for centering all our content */
#container {
width: 400px;
margin: 10px auto 10px auto;
padding: 20px;
border-top: #000 thin dashed;
border-right: #999 20px dotted;
border-bottom: #333 medium solid;
border-left: #CCC thick ridge;
}
which gives us the same results, but with just four properties in the rule. If all values were to be
the same, the properties can be further combined into one using border:
/* Container for centering all our content */
#container {
width: 400px;
margin: 10px auto 10px auto;
padding: 20px;
border: #000 thin dashed;
}