Adding round corners to boxes using CSS and JavaScript

Curvycorners has a way to make gorgeous roundings to your boxes without having to split each box into pieces of background images. You simply need to include one JavaScript file and add two lines of CSS code to your box (or to the box’s class definition).

First, include the curvycorners javascript file in the head part of your webpage.

Then, add the following lines to the box that should get round corners. Here you can also customize the radius:

-moz-border-radius: 3px;-webkit-border-radius: 3px; 

That’s all, the result looks like this:

A box with curvy corners.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s