cross browser rounded corners...

MuGeN

MuGeN

MuGeN

Associate
Joined
21 Oct 2008
Posts
1,679
Location
Mooching... in your house
so... whats the best method for rounded corners these days? one thats works across the board yada yada yada...

roll on CSS3 :(
 
CSS3 and forget about browsers that don't support it (is it really crucial to the design?) or a bit of jQuery if you're already using it on the page for something else.
 
^ Yup. CSS3 and forget those too lazy/stupid* to upgrade their browser.



* Yes, I know not everyone is responsible for the browser they use at work/school yadda yadda
 
I think for stuff like this, moving over to CSS3 is needed. Progressive enhancement and all that...

70% of people are using a browser other than IE now apparantly anyway, and IE users will still be able to view the site fine, it'll just have square corners. Hopefully this will push more people to change to a decent browser sooner. :p
 
Stick to the ol' curved image for now. 2 if you're feeling normal, 4 for adventure, 8 for a wild time!

Shame it's such an issue... old browsers that is.
 
Muel said:
I looked up the browser stats before I posted and it was around 70%. What else is there to go on apart from the indicated stats?
Click to expand...
Stats of the existing site. Stats of comparable sites, at a push.

There are two answers to the rounded corners question:

1. If you're responsible for design and development: Use CSS3, and manage your client's expectations by, for instance, not showing them a static mockup in Photoshop.

2. If you're 'only' doing the dev work: Chances are the designer hasn't managed the client's expectations very well, so they're going to surprised to see square corners when they approved rounded ones. JQuery or images in this case.
 
Could anyone recommend a tried and tested jquery plugin then? There are a few to pick from so if anyone has any experience?

Needs to work with borders too... The -webkit radius method is perfect if only it worked across the board (not really css3 tho is it, far too strange a syntax)
 
Muel said:
I looked up the browser stats before I posted and it was around 70%. What else is there to go on apart from the indicated stats?
Click to expand...

http://en.wikipedia.org/wiki/Usage_share_of_web_browsers
I find this gives a more balanced total instead of something like w3schools which would obviously be inclined more away from IE as most visitors would be more tech savy.



MuGeN said:
Could anyone recommend a tried and tested jquery plugin then? There are a few to pick from so if anyone has any experience?
Needs to work with borders too... The -webkit radius method is perfect if only it worked across the board (not really css3 tho is it, far too strange a syntax)
Click to expand...

I've used curvycorners in the past and it worked alright. You just set the border-radius and it'll auto detect it so good browsers still get their own native border-radius and IE gets the div treatment.
http://www.curvycorners.net/
 
Last edited:
I just assumed that someone like W3C schools would have said if the stats were only for that site. :p

I think I'll be implementing that curvycorners tool, thanks for that! Needs some work from reading the comments though, and even the demo page throws up errors for me in IE8.

If anyone is using IE with javascript turned off then they don't deserve rounded corners if you ask me. :p

Now just to find something to deal with opacity on divs...
 
Last edited:
Muel said:
I think I'll be implementing that curvycorners tool, thanks for that! Needs some work from reading the comments though, and even the demo page throws up errors for me in IE8.
Click to expand...

Also pay attention to the bit that tells you about calling in the redraw function if you have any dynamic html.
 
I still prefer to do nice graphically enhanced rounded corner boxes. Border-radius is nice and easy, but it just looks plain and boring. Soon every man and his dog will be doing the same. One site will look similar to another :P
 
While I won't ignore IE completely. I will glady, like google, ignore IE6. It's also taken in to account the HUGE majority of office PCs that refuse to upgrade and thus have IE and unfortunately IE6 based browsers.

I've said it before and I will say it again. Not building for IE6 should be the concern of the user and not the designer/developer. If anything it should encourage IE6 users to upgrade.
 
FabienO said:
While I won't ignore IE completely. I will glady, like google, ignore IE6. It's also taken in to account the HUGE majority of office PCs that refuse to upgrade and thus have IE and unfortunately IE6 based browsers.

I've said it before and I will say it again. Not building for IE6 should be the concern of the user and not the designer/developer. If anything it should encourage IE6 users to upgrade.
Click to expand...

I agree with you. I don't build or test for IE6 anymore.
 
A lot of large corporations still use IE6.. including much of the public sector.

It's *your* website that is losing out. Even if you just have a conditional IE6 style sheet that is less "flashy" than the real one is better than a broken site.
 
I completely agree with Jester, fact is even if 5% of your customers are using IE6, the do you want to lose 5% revenue for the sake of the extra (painful as they may be) hours to make the site compatible.

I wish we could kill it off completely but alas, we can't and won't be able to any time soon for serious corporate sites.
 
MuGeN said:
I completely agree with Jester, fact is even if 5% of your customers are using IE6, the do you want to lose 5% revenue for the sake of the extra (painful as they may be) hours to make the site compatible.

I wish we could kill it off completely but alas, we can't and won't be able to any time soon for serious corporate sites.
Click to expand...

Lets not forget about companies that use website filtering software. Theres no guarantee that public sector or some companies will see your site in work time anyway. I know as I speak of experience. So maybe that 5% you speak of, could i reality be 2% due to website blocking software installed on company servers.
 
I work with a lot of B2B hardware and software sales companies and their offices are riddled with IE6. It's a pita but a conditional separate stylesheet and IETester is still a must.
 
You must log in or register to reply here.
Back
Top Bottom