Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

At this point in time, it is far easier to just rely on CSS extensions well supported by Firefox and Safari, for instance:

-moz-border-radius-topleft: 0.4em; -webkit-border-top-left-radius: 0.4em; -moz-border-radius-topright: 0.4em; -webkit-border-top-right-radius: 0.4em; -moz-border-radius-bottomleft: 0.4em; -webkit-border-bottom-left-radius: 0.4em; -moz-border-radius-bottomright: 0.4em; -webkit-border-bottom-right-radius: 0.4em;

This doesn't mess up your HTML with divs, and degrades seamlessly to "not rounded corners" in any other browser.



Amen! Although to make the point better, you can just use the shorthand: -moz-border-radius: 0.4em; -webkit-border-radius: 0.4em;

Seven lines of CSS and fifteen of HTML per box is bullshit when you can do the same thing in a standard and semantically better way in the space of a Twitter message. I can hardly believe people still put so much effort into IE-specific workarounds for purely decorative effects.


I don't disagree with using the extensions...

... but ...

if you're actually writing 15 lines per box, you're doing it wrong.

refactor refactor refactor


There is no right way to do something this stupid.


most people, excluding hackers of course, probably use ie.


so let's give them more reasons to switch :-)


Actually nowadays, firefox is 1/5th of the browser market. It's a significant chunk of the market.


At least in Firefox 2, corners made with border-radius are not anti-aliased and look pretty horrible. (Firefox 3 may fix this.)


This technique doesn't antialias the corners either. It just draws tiny background rectangles with careful margins. But it's pretty clever, IMHO. And a few lines of jquery could automatically add the extra markup at load time.


IIRC, opera also supports this (without a -*- prefix). I think for the individual corners you use -topleft instead of -top-left-.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: