CSS3 Border Radius property

CSS3 Border Radius property

Want to customize the borders of the boxed elements in your website?

This plug-in enables you to customize the borders of the box. It enables you to modify the line thickness. It also enables you to create round corner boxes without using images. This plug-in makes it simple to create flexible and re-sizable rounded corner box. It is really amazing that this plug-in makes it simple and easy to create rounded corners box. For a better understanding view the live examples of the code below.

To make this above box rounded few line of advanced CSS should be applied. Let’s say this box is made with div tag and has class name rounder.

[javascript language="css"]div.rounder{
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
}[/javascript]

Here, as above code is showing we are giving border radius 7px to our div. After applying this code to div, rounded corners of size 7px will be appeared in the box. and it will look something like this,

It’s really amazing feature giving its simplicity and easiness to create rounded corners box.

This feature supports all the latest browsers like, Firefox 3+, IE9+, Opera 10.5+, Chrome 4+, Safari 3.1+ .

To get the version of the script integrated within a live template visit the website whose link is mentioned here: Boxedart.com

Interested? Want to keep yourselves updated with the latest JavaScripts and codes? Try this website a1javascripts.com for more jQuery, CSS and HTML5 techniques.

JQuery is a very powerful tool, the more you learn about, more will you be amazed what it is capable of. Stay with us for lot of upcoming articles, Guidelines with plenty of great tutorials, Resources, etc.

One Response to “CSS3 Border Radius property”

  1. Many thanks for the high quality writeup.