rounded borders and IE 7

•

rounded borders and IE 7
by Bret Williams on Oct 4, 2008 at 4:55:31 am

I love the new bleeding edge method of creating rounded borders to div boxes with css 3. However, since the spec isn't final it only works in webkit and mozilla (safari and firefox). Ok, well fine. But I notice that you have to define it for both, using the -moz or -webkit at the beginning of the css rule. Is there a way to create a rule that only applies to IE? For example, I could not apply the curved borders and outlines, and instead have a curved background image.

Yeah, I know, why not just do the curved background image. Well, I like my sites to be scaleable generally, and broswser created radius and border scales while a background image just gets fuzzy.

So anyone have a special rounded corner trick for IE that doesn't involve gifs in the corners? Or have a way to do separate CSS for IE?

Return to posts index

•

Re: rounded borders and IE 7
by Abraham Chaffin on Oct 6, 2008 at 4:16:09 pm

Hey Bret,

I've seen a few try and do it with Javascript. The results however, from my point of view are not totally successful.
http://www.curvycorners.net/
for instance doesn't exactly work as I would want it to work in IE. It leaves a little bit of artifacting when viewing it in certain versions of IE7.

My method has been a table method. As I like tables =o
A 3x3 table with the content in the middle and scalable and the corner bg images in the corners. The top, bottom and sides with borders possibly. This method seemed to work pretty good for me. Though I know tables are a faux pas.

Abraham

Return to posts index