One of the challenges to CSS-only designs are replicating some of our old favourites without using tables and chief amongst these is the box with rounded corners. It is a tricky one as a CSS-only solutions can get pretty complicated. However, there are also JavaScript solutions which solve this problem. See resources below:BoxLib v1.0.20030701 Rounded corners in CSS W3C CSS tips & tricks : Rounded corners and shadowed boxes Bullet-Proof Rounded Corners - an impressive solutionRounding Tab Corners - an great variation on the theme from Eric Meyer and (as always) a very nice expalantion.Rounded corners - comments on the above tehnique from Mark Pilgrim (a leading accessibility expert).Doug's easyCorners - a nicely simple solution.Rounded corners with CSS Rounded Box for CSS Compliant Browsers Corners - Nested divs revisited - demonstrates various CSS and JavaScript solutions.Absolutely Buggy II: Absolute boxes inside relative boxes - demonstrates the theory and problems with one methodStretchable Graphical Borders Or, how to have fun with Cascading Style Sheets CSS Layout: Liquid Box with Rounded Corners Redesigning with CSS Rounded Corners BoxLib - a JavaScript solution from Scott Schiller"The ThrashBox" – Rounded Corners for All - Simple, Semantically Correct CSS Boxen with Clean CodeCSS Design: Creating Custom Corners & Borders - good tutorial from ALA on this.Emperor (Added by: Emperor on Thu 03-Jul-2003) (Edited by: Emperor on Mon 22-Sep-2003) (Edited by: Lacuna on Thu 20-Nov-2003) (Edited by: Emperor on Fri 05-Dec-2003) (Edited by poi on 01-25-2005 03:36)
