Have Geek Brain

Rounded corners of an image in IE and Firefox

I cannot make the image a background image for the div and around the corners of the div, because the image changes, and as far as I know, you cannot resize the background image.

What are my options, if any? Open to all suggestions, including cover dividers and corner images.

Also, if it is not possible to do this in IE, but there is a solution for Firefox, this is just fine with me.

+2


a source to share


4 answers


If you are reusing the image and resizing, you should split your corners appropriately if possible. I took a quick look at you and here's a site that shows you how to achieve it using sprites. This makes your markup bigger because you need to use positioned divs to position each part of the window.



Of course, the latest versions of Firefox, Safari, Opera and Chrome support border-radius , which allows you to create rounded corners without using images, IE9 will also support this when it is released.
I've seen sites that use a border radius and just leave it at that, so the borders aren't rounded in browsers that don't support it.

+1


a source


If you are interested in creating corners in IE this might be helpful - http://css3pie.com/



+1


a source


I am using jQuery plugin. You can do:

$ ('# DIV') angle ('10px') ;.

0


a source


I'm not sure, but maybe you can achieve what you want using an svg background. This won't work in IE.

0


a source






More articles:


All Articles