CSS Rounded Corners
By Forrest Smith - Drempd.com
Rounding All Corners of an Element:
Basic rounded corners (all corners of the element will be rounded):
#example {
-moz-border-radius: 15px; //Mozilla tag
border-radius: 15px; //Standard tag for all browsers
}
Targeting Specific Corners:
Both W3C and Mozilla specifications are given. Both will need to be listed for the rounded corners to be seen in all browsers.
| W3C | Mozilla |
| border-radius | -moz-border-radius |
| border-top-left-radius | -moz-border-radius-topleft |
| border-top-right-radius | -moz-border-radius-topright |
| border-bottom-right-radius | -moz-border-radius-bottomright |
| border-bottom-left-radius | -moz-border-radius-bottomleft |
#example {
-moz-border-radius-topleft: 15px; //Mozilla tag
border-top-left-radius: 15px; //Standard tag for all browsers
}