Revision: 30018
Updated Code
at August 6, 2010 03:26 by brandonjp
Updated Code
/* 201008051249 - brandonjp - me trying to remember css/moz/webkit border radius Thanks to Jacob Bijani - CSS Border Radius http: //bit.ly/8Y8cJT Thanks to CSS Border Radius : : Richard A. Johnson http: //bit.ly/c9FclS */ CSS3 { border-top-left-radius: 22px; border-top-right-radius: 44px; border-bottom-right-radius: 66px; border-bottom-left-radius: 88px; } MOZILLA { -moz-border-radius-topleft: 22px; -moz-border-radius-topright: 44px; -moz-border-radius-bottomright: 66px; -moz-border-radius-bottomleft: 88px; } KHTML { -khtml-border-top-left-radius: 22px; -khtml-border-top-right-radius: 44px; -khtml-border-bottom-right-radius: 66px; -khtml-border-bottom-left-radius: 88px; } WEBKIT { -webkit-border-top-left-radius: 22px; -webkit-border-top-right-radius: 44px; -webkit-border-bottom-right-radius: 66px; -webkit-border-bottom-left-radius: 88px; } TOP-LEFT { border-top-left-radius: 22px; -moz-border-radius-topleft: 22px; -khtml-border-top-left-radius: 22px; -webkit-border-top-left-radius: 22px; } TOP-RIGHT { border-top-right-radius: 44px; -moz-border-radius-topright: 44px; -khtml-border-top-right-radius: 44px; -webkit-border-top-right-radius: 44px; } BOTTOM-RIGHT { border-bottom-right-radius: 66px; -moz-border-radius-bottomright: 66px; -khtml-border-bottom-right-radius: 66px; -webkit-border-bottom-right-radius: 66px; } BOTTOM-LEFT { border-bottom-left-radius: 88px; -moz-border-radius-bottomleft: 88px; -khtml-border-bottom-left-radius: 88px; -webkit-border-bottom-left-radius: 88px; } CSS 3 { /* 5px radius on all 4 corners of the table */ border-radius: 5px; /* 5px radius on top left and bottom right corners only */ border-radius: 5px 0 5px 0; /* 5px radius on bottom left and top right corners only */ border-radius: 0 5px 0 5px; /* 5px radius on the top left corner only */ border-top-left-radius: 5px; /* 5px radius on the bottom left corner only */ border-bottom-left-radius: 5px; /* 5px radius on the top right corner only */ border-top-right-radius: 5px; /* 5px radius on the bottom right corner only */ border-bottom-right-radius: 5px; } Mozilla (Firefox) { /* 5px radius on all 4 corners of the table */ -moz-border-radius: 5px; /* 5px radius on top left and bottom right corners only */ -moz-border-radius: 5px 0 5px 0; /* 5px radius on bottom left and top right corners only */ -moz-border-radius: 0 5px 0 5px; /* 5px radius on the top left corner only */ -moz-border-radius-topleft: 5px; /* 5px radius on the bottom left corner only */ -moz-border-radius-bottomleft: 5px; /* 5px radius on the top right corner only */ -moz-border-radius-topright: 5px; /* 5px radius on the bottom right corner only */ -moz-border-radius-bottomright: 5px; } KHTML (Konqueror) { /* add -khtml- in front of the CSS 3 styles */ -khtml-border-radius: 5px; } Webkit (Safari/Chrome) { /* add -webkit- in front of the CSS 3 styles */ -webkit-border-top-right-radius: 5px; }
Revision: 30017
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at August 6, 2010 03:24 by brandonjp
Initial Code
/* 201008051249 - brandonjp - me trying to remember css/moz/webkit border radius Thanks to Jacob Bijani - CSS Border Radius http: //bit.ly/8Y8cJT Thanks to CSS Border Radius : : Richard A. Johnson http: //bit.ly/c9FclS */ CSS3 { border-top-left-radius: 22px; border-top-right-radius: 44px; border-bottom-right-radius: 66px; border-bottom-left-radius: 88px; } MOZILLA { -moz-border-radius-topleft: 22px; -moz-border-radius-topright: 44px; -moz-border-radius-bottomright: 66px; -moz-border-radius-bottomleft: 88px; } KHTML { -khtml-border-top-left-radius: 22px; -khtml-border-top-right-radius: 44px; -khtml-border-bottom-right-radius: 66px; -khtml-border-bottom-left-radius: 88px; } WEBKIT { -webkit-border-top-left-radius: 22px; -webkit-border-top-right-radius: 44px; -webkit-border-bottom-right-radius: 66px; -webkit-border-bottom-left-radius: 88px; } TOP-LEFT { border-top-left-radius: 22px; -moz-border-radius-topleft: 22px; -khtml-border-top-left-radius: 22px; -webkit-border-top-left-radius: 22px; } TOP-RIGHT { border-top-right-radius: 44px; -moz-border-radius-topright: 44px; -khtml-border-top-right-radius: 44px; -webkit-border-top-right-radius: 44px; } BOTTOM-RIGHT { border-bottom-right-radius: 66px; -moz-border-radius-bottomright: 66px; -khtml-border-bottom-right-radius: 66px; -webkit-border-bottom-right-radius: 66px; } BOTTOM-LEFT { border-bottom-left-radius: 88px; -moz-border-radius-bottomleft: 88px; -khtml-border-bottom-left-radius: 88px; -webkit-border-bottom-left-radius: 88px; } CSS 3 { /* 5px radius on all 4 corners of the table */ border-radius: 5px; /* 5px radius on top left and bottom right corners only */ border-radius: 5px 0 5px 0; /* 5px radius on bottom left and top right corners only */ border-radius: 0 5px 0 5px; /* 5px radius on the top left corner only */ border-top-left-radius: 5px; /* 5px radius on the bottom left corner only */ border-bottom-left-radius: 5px; /* 5px radius on the top right corner only */ border-top-right-radius: 5px; /* 5px radius on the bottom right corner only */ border-bottom-right-radius: 5px; } Mozilla (Firefox) { /* 5px radius on all 4 corners of the table */ -moz-border-radius: 5px; /* 5px radius on top left and bottom right corners only */ -moz-border-radius: 5px 0 5px 0; /* 5px radius on bottom left and top right corners only */ -moz-border-radius: 0 5px 0 5px; /* 5px radius on the top left corner only */ -moz-border-radius-topleft: 5px; /* 5px radius on the bottom left corner only */ -moz-border-radius-bottomleft: 5px; /* 5px radius on the top right corner only */ -moz-border-radius-topright: 5px; /* 5px radius on the bottom right corner only */ -moz-border-radius-bottomright: 5px; } KHTML (Konqueror) { /* add -khtml- in front of the CSS 3 styles */ -khtml-border-radius: 5px; } Webkit (Safari/Chrome) { /* add -webkit- in front of the CSS 3 styles */ -webkit-border-top-right-radius: 5px; }
Initial URL
Initial Description
Initial Title
CSS - CSS3 border-radius - understanding CSS3 Moz Mozilla KHTML Webkit Border Radius.css
Initial Tags
css, CSS3
Initial Language
CSS