Pages

Monday, February 6, 2012

How to create rounded corners Using CSS




Ever wanted to rounded corners to your DIV without using those boring images on the sides ? Well if you are using a CSS3 supported browser like Mozilla Firefox 3 or Safari 3 or Google Chrome then there is a simple CSS style to generate rounded corners. Just write the followingĂ‚  CSS rule to the element

div {
-moz-border-radius: 5px;                                 
-webkit-border-radius: 5px;
}

And when you need to target the other browsers like the Internet
Explorer which doesn’t support those tags its time to use javascript for
action.Curvycorners is a free javascript that can create transform DIV tags into rounded cornered one on the fly. This script is hassle free and you dont require any images.The next good thing is that it supports full anti-aliasing. The script is licensed as LGPL which means you can use it for free but you are not liable to edit it.
Download, Documentation and Examples

You can download the script from here
Usage is quite simple, to sum-up add the js file, configure and add the setings code (in javascript) and the HTML tags.


No comments:

Post a Comment