Rounded corners with CSS and graphics is OK – but a pain to set up – requiring custom images and plenty of extra markup. JavaScript – particularly when helped by jQuery comes to the rescue and makes it fairly trivial. Requiremtents: must work with IE6, IE7, iE8, FF and Safari (note about IE8 below).

Main contenders:

  1. for jQuery: jquery.corner.js from rc.rctonline.nl
  2. for jQuery: jquery.corner.js from malsup.com
  3. for jQuery: cornerz
  4. stand alone: curvycorners

Using #1 at the moment. Would like to try them all again in the light of the IE8 workaround below. Gotta say I now think #3 (cornerz) looks most promising in terms of size and ability. Going to have another look to see which ones look to CSS first (for those browsers that are modern – and not Internet Explorer) before turning to JavaScript.

Problem with most of these is IE8 doesn’t play nice… fix seems simply to add the behave like IE7 meta tag: <tt><meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE7″ /></tt>

First impressions:

  1. good, non-transparent outside corner
  2. good,
  3. throws errors in IE7, non-transparent outside corner
  4. slow in IE,

Last updated on 5th September 2018