Individual Rounded Corners

Submitted by:Andery Smith

Date added:10 October, 2013

Category:CSS

CSS code for individual rounded corners. A longer base with each corner radius broken down into a different property.

Tags: round , corners

Code Snippet:

    #container {  
-webkit-border-radius: 4px 3px 6px 10px;
-moz-border-radius: 4px 3px 6px 10px;
-o-border-radius: 4px 3px 6px 10px;
border-radius: 4px 3px 6px 10px;
}

/* alternative syntax broken into each line */
#container {
-webkit-border-top-left-radius: 4px;
-webkit-border-top-rightright-radius: 3px;
-webkit-border-bottom-rightright-radius: 6px;
-webkit-border-bottom-left-radius: 10px;

-moz-border-radius-topleft: 4px;
-moz-border-radius-topright: 3px;
-moz-border-radius-bottomright: 6px;
-moz-border-radius-bottomleft: 10px;
}
 
 

Comments