html.it — Rounded Corners with CSS are a hot topic in web design: I think that there are hundreds of articles on them. This page is intended to present the solution I came up, that doesn't requires images, extra markup nor CSS.
Sep 26, 2006 View in Crawl 4
nubnubSep 26, 2006
javascript counts are extra markup...
olegkSep 26, 2006
Cmon. This was posted at least 10 times.<a class="user" href="http://digg.com/design/100_CSS_Rounded_Corners_WITH_anti-aliasing._No_images._No_JavaScript.">http://digg.com/design/100_CSS_Rounded_Corners_WITH_anti-aliasing._No_images._No_JavaScript.</a><a class="user" href="http://digg.com/design/Ultimate_Imageless_Rounded_Corners_with_Anti-Aliasing_">http://digg.com/design/Ultimate_Imageless_Rounded_Corners_with_Anti-Aliasing_</a><a class="user" href="http://digg.com/programming/CSS_rounded_corners_without_images">http://digg.com/programming/CSS_rounded_corners_without_images</a> <a class="user" href="http://digg.com/design/CSS_Rounded_Corners_WITHOUT_using_images_-_tutorial">http://digg.com/design/CSS_Rounded_Corners_WITHOUT_using_images_-_tutorial</a> <a class="user" href="http://digg.com/design/Rounded_Corners_for_your_webpage_without_images">http://digg.com/design/Rounded_Corners_for_your_webpage_without_images</a><a class="user" href="http://digg.com/design/Rounded_corners_in_IE_without_images.">http://digg.com/design/Rounded_corners_in_IE_without_images.</a><a class="user" href="http://digg.com/videos_educational/VIDEO_Rounded_Corners_Without_Images._No_CSS!_No_JavaScript!">http://digg.com/videos_educational/VIDEO_Rounded_Corners_Without_Images._No_CSS!_No_JavaScript!</a><a class="user" href="http://digg.com/design/Rounded_corners_without_CSS_Hacks_or_Images">http://digg.com/design/Rounded_corners_without_CSS_Hacks_or_Images</a> <a class="user" href="http://digg.com/design/Nifty_Corners_Cube:_rounded_corners_without_images">http://digg.com/design/Nifty_Corners_Cube:_rounded_corners_without_images</a><a class="user" href="http://digg.com/design/Get_Rounded_Corners_Without_Images_using_CSS">http://digg.com/design/Get_Rounded_Corners_Without_Images_using_CSS</a><a class="user" href="http://digg.com/design/List_of_amazing_tutorials::_Cool_rounded_Corners_using_CSS_without_images">http://digg.com/design/List_of_amazing_tutorials::_Cool_rounded_Corners_using_CSS_without_images</a><a class="user" href="http://digg.com/tech_news/Nifty_Corners:_rounded_corners_without_images">http://digg.com/tech_news/Nifty_Corners:_rounded_corners_without_images</a>
coolbruSep 26, 2006
(for the second time) It's been in Safari nightly builds for a year or so, been working right for the last few months. <a class="user" href="http://webkit.org/blog/">http://webkit.org/blog/</a>Firefox uses a proprietary tag (quite rightly, because CSS3 is not final). Safari nightlies use the CSS3 syntax, but then it's not released yet, so both browsers are playing by the rules.
soupisgoodfoodSep 26, 2006
No digg. This uses heaps of frivolous tags. I'd rather just use images. It looks better and is much better from an accessability point of view, too, ironicly.
jon3kSep 26, 2006
"This page is intended to present the solution I came up, that doesn't requires images, extra markup nor CSS."then down about half a page ..."And here's it the basic CSS:"Yeah, so it doesn't require CSS but it does. Marked inaccurate.
cl1mh4224rdSep 26, 2006
This account has been closed by the user
manincSep 27, 2006
Irrespective of whether it was dugg earlier or not. Irrespective of if questions of usage for large scale apps, irrespective of old news vs new news...irrespective of anything, The guy is creative enough to do this up for us all and release it as open source. so lets be appreciate of this and encourage...so that creativity doesnt die..!!
rorytSep 27, 2006
That is pretty cool. Now what to do with it? mm...
theadvinciJul 1, 2008
Rounded corners - so you wouldn't hurt yourself.
lmcnuttMay 28, 2009
Better solution, using dynamically generated images from your <img src="" /> tag or {background-image: url();} css element.<a class="user" href="http://www.easyimg.com">http://www.easyimg.com</a>Cool?
idiggmacsJun 11, 2009
I've used this technique. It's a PITA! The result is great. But in a very dynamic code base (weekly launches and every changing features and code), this takes too much time to maintain. It's also difficult to get all the designers and developers to do it consistently. I now prefer just creating rounded corner background images like Apple does on their site. It's faster, less problematic and much less time consuming.