This Message Forum is no longer in use

Please use the new Bravenet Help Forums FOUND HERE

General Forum
This Forum is Locked
Author
Comment
CSS and rounded corners?

Is there a way to round the corners of the border of an element with CSS?

Re: CSS and rounded corners?

There is a rounded corner property proposed for CSS3, but I doubt that any of the browsers have implemented it yet. To see if your browser can see them try this example.

But until that gets accepted and into the standard, and to be compatible with older browsers, rounded corners is usually handled with images. Try this link to Web Style Sheets - CSS tips & tricks. For more information, do a Google search with the string "border rounded corners". You will get lots of information on rounded corners.

Re: CSS and rounded corners?

Thanks a lot! That was plenty of help!

...they are at this time (January 2004) only a proposed property for CSS3...
Seems to take quite a while for the browsers to catch up. I just recently heard somewhere that CS3 was finalized and should be widely supported now but none of the examples worked in my firefox browser, haha.

Re: CSS and rounded corners?

I have tried for rounded corners but gave up.
Most of the techniques need images and additional code.
CSS3 is not being supported by browsers such as IE and firefox.
Try nifty corners design.

Re: CSS and rounded corners?

Safari is starting to support some of the CSS3 features, but I wouldn't expect IE to support them for another 3 or 4 years. And, just because a browser says they support CSS3, does not mean they support all of CSS3.

Many of the CSS3 properties are already supported in CSS2, so it's a no-brainer for most browsers. If your going to use any of the CSS3 properties now, only use the ones that will degrade gracefully, like text-shadow, or box-shadow. If the users browser supports them, the viewer sees your design as you intended it. If the property is not supported, they simply see a slightly degraded version, and don't know the difference. Don't make your page depend on them.