CSS

CSS Rounded Corners That Really Work in IE and Firefox

Posted by Joel 28 October, 2009 (1) Comment

For any web design rounded cornered rectangles add a touch of professionalism and beauty. Unfortunately most methods using either JavaScript or layered images do not work very well on all browsers as expected by the designer or the user.

Finally there is a nice method which works very well with IE7+ and Firefox 2+ perfectly, this is in fact by using CSS3 where 4 rectangles are layered one above the other to emulate a rounded corner and this method unlike others works perfectly with most browsers, although I haven’t tested it with IE6.

Let’s Get Started.

Now we will be adding four rectangles (or lines whatever you wish to call them) which overlap each other, when combined they give the effect of a rounded corner. Now I will give you a small sample which will explain you what I’m trying to say properly.

Read the rest of this entry

Categories : Blogging, CSS Tags : , , , , ,