This is a recon on Creating Rounded Corner Widgets. The alternative and to save some lines in constant.css and to properly address some rounded wont work is to use the csscaffold default css3 mixins.
The best part is, this is much easier to understand.
+border-radius(5px);
+border-top-radius(5px);
+border-bottom-radius(5px);
+border-top-left-radius(5px);
+border-top-right-radius(5px);
+border-bottom-left-radius(5px);
+border-bottom-right-radius(5px);
So, if i want to make a widget box top portion to get rounded, I simply use:
#my_widget {
+border-top-radius(5px);
}
What if i want to make my widget box to have a rounded corner but not at the top left corner? simple:
#my_widget {
+border-radius(5px);
+border-top-left-radius(0px);
}
You can find more mixins at:
https://github.com/sunny/csscaffold/tree/master/scaffold/mixins
Enjoy!
