Rounded corners with CSS

Posted on 06 April 2005 by Clive Walker in CSS

I wrote this post a while back. The content can still be relevant but the information I've linked to may not be available.

A recent project needed rounded corners for some page elements and we thought about a few ways of doing this. The only problem was that our new website should use CSS without the use of tables for layout purposes….

Well, we were aware of a few methods but they all seemed to use various background image methods and involved adding extra divs to accommodate the nice corner images that we desired. That is until this method using CSS with JavaScript came to our attention.

What a great solution! No images were harmed in the making of these nice examples and the method can be applied to different page elements.

In fact, if you can live with a little semantic incorrectness then JavaScript is not needed for the first example.

Now updated with new version Nifty Corners