Round Corners in Safari

[ronnyjljr]

Hi,

If I have a <div> or a <fieldset> tag in Firefox, I can apply the following styles to make them have rounded corners:

-moz-border-radius: 8px;
-moz-box-sizing: border-box;

In IE I use VML to render rounded rectangles to replaces <divs> and the <fieldset> tag is already rounded if Windows Themes are enabled.

Is there something similar for Safari and Opera to produce rounded rectangles?

Thanks,
~R

typedef map<GiantX,gold, less<std::shortestpathtogold> > AwesomeMap;

 

[BabyJeffy]

In theory you should be able to just use the following:

border-radius: 8px;

But, of course, nobody supports this stylish CSS3 property just yet (Opera 9.5 is going to support it - due soon).

For Safari you can use the webkit namespace (instead of moz for Firefox). The following works to give you the same rounded corders in Safari (will also work on Konqueror):

-webkit-border-radius: 8px;

You can read about this property (and others) here:

http://www.css3.info/preview/rounded-border/

Check out this link for a run down on the CSS3 [tt]border-radius[/tt] property in Opera and the fact it is to be supported in Opera 9.5:

http://dev.opera.com/articles/view/new-development-techniques-using-opera-k/

Hope that sheds the light on some stuff!

Cheers,
Jeff

[tt]Jeff's Blog [!]@[/!] CodeRambler

http://www.coderambler.com/

http://www.coedit.co.uk/

[/tt]

Make sure your web page and css validates properly against the doctype you have chosen - before you attempt to debug a problem!

FAQ216-6094