Curved Border with an image in HTML

[developerquery]

How do I write text inside a border made up of image while preparing newsletter, I know its easy in CSS3 but as its a HTML Newsletter all email clients doesn't support the curved effect, I know that it has 4 images but how do I joint them like the one in the attachment.

[Anas Mosaad]

There are more than one way to do the rounded corners. The simplest one is to use the background image as is in the background. In addition to its simplicity, it has a performance gain. The size of the file is not an issue compared to the combined size of four images but you eliminated 3 additional requests to the server.

Another simple way would be to have the upper and lower parts of the image. For example, if you have a portlet like component. You'd assign the background if the title as the top image and make it non-repeatable and aligned top. And the bottom image as the background of the container div aligned bottom and non-repeatable.

A complex one would be stack four transparent DIVs without margins or padding and assign the background of each one to a corner without a repat.

In the second and the third, you may have a border with the same spcecs as the rounded corner. This is not an easy ride in case 3.

[developerquery]

Can I see a example.

[Anas Mosaad]

You can find the first example at nakheel dot com. An article describing the last technique at http://www.sitepoint.com/css-round-c...-boxes-curves/