At our January meeting, we looked at creating rounded corners on boxes using CSS. We looked at small boxes and then full page layouts, both fixed-width and fluid width.
With table based layouts, we made rounded corners by putting curved images in the cells at the four corners of the table. CSS uses the same concept, but the images are backgrounds to the elements of the HTML. For fixed-width boxes, you just need an image with round edges at the top and one at the bottom. For fluid width, there has to be quarter-circle graphics at the four corners in order to allow expansion horizontally.
25 Rounded Corner Techniques,
Smiley Cat Web Design,
And if you don’t want to create your own graphics, try the Rounded Corner and Gradient Generator: http://www.roundedcornr.com/
CSS3 will make the use of images unnecessary because it will include the property “border-radius.” Browsers don’t currently support this property, but in Safari and the Mozilla browsers, there are commands that will let you use border-radius. See these sites:
CSS rounded corners without images - Arve Bersvendsen, http://virtuelvis.com/archives/2004/11/imageless-rounded-corners