Curves and Images
Images can pose special problems when used in conjunction with curved divs. The image with the stripes at the top of this page appears to have curved corners when viewed in any browser except Internet Explorer. It really has square corners. The curve effect is caused by how the image is used within the div.
The image on the left is 200 pixels wide and 100 pixels high. There is nothing particularly special about it.
When the image is placed within a division that is 200 pixels wide, 100 pixels high, and has rounded corners with a red border the image corners extend out of the curved borders.
A similar div can be constructed that has one significant difference. The image is not inserted into the div. Instead it is used as a background for the div. The curved effect is retained.
< Return to Page 1 >