Thursday, September 30, 2010

Gradient Borders with CSS



An example for Gradient Border to a box. This example works work in Mozilla and Firefox browsers.



Try with the below class property of the gradient border.

.gBorder {
border: 20px solid #000;
-moz-border-top-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-right-colors: #111 #222 #333 #444 #555 #666 #777 #888;
-moz-border-bottom-colors: #111 #222 #333 #444 #555 #666 #777 #888;
-moz-border-left-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
width:400px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:.9em;
padding:10px;
}