Rounded Corners

Jul 16, 2009 17:30

Account Status: Free
Actions: Rounding Corners
Theme: Flexible Squares (not sure if it works with other themes)

I was over at scholarslayouts when I discovered that not only is midianscholar at artist with a layout but and interesting bit of code:
-moz-border-radius: 10px;
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright:10px;

To make sure this feature crosses most web browsers consider adding these codes along with the above code:
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
-khtml-border-radius: 10px;

Short hand coding to eliminate the bottomleft, bottomright, etc codes:
-moz-border-radius: [top-left] [top-right] [bottom-right] [bottom-left]
-moz-border-radius: 10px 20px 30px 0;
-webkit-border-radius: 10px 20px 30px 0;
border-radius: 10px 20px 30px 0;
-khtml-border-radius: 10px 20px 30px 0;



For more tutorial help see Rounded Corners @ CSS-Tricks.

account: paid-permanent, help with: rounded corners, #account: all, .flexible-squares, feature: design

Previous post Next post
Up