On 7/8/08, Sohail Aboobaker <[EMAIL PROTECTED]> wrote: > Hi, > > What is the simplest way to create rounded corners using CSS. I saw a > technique using 3 extra div tags for three corner images (left-bottom, > right-bottom, left top) which seemed cumbersome and the posting was old. Are > there any newer and simpler ways of creating rounded boxes containers? >
Depends on your requirements: The need for multiple elements is based on the idea that using background images as corners is morally better than adding foreground images (and looks less ugly in the absence of stylesheets) - you need one element to hang each background on*. If you have a fluid-width, fluid height box, you therefore need four elements. If the box is fixed-width, you only need two. If it has a fixed height as well, you can get away with one, but I'd only risk this on an element containing nothing but a single image. If the element has borders, it gets more complex: I've seen methods using 8 elements (just as bad as a table) or using positioning jiggles with mixed success. The wiki has a pretty comprehensive round-up of methods. *Until everyone implements the backgrounds module of css3, at which point rounded corners will become much easier, but I'm picking that everyone will support border-radius before that. -- Richard Grevers, New Plymouth, New Zealand Dramatic Design www.dramatic.co.nz ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
