Sidebox Table & Image Problem

[gjh42]

Okay, as I thought, you just want rounded sideboxes. You don't need tables. All of this can be done with a couple of images for the top and bottom of the sideboxes, and some stylesheet rules.

Start by putting all of your blank_0x.gif images together in Photoshop (or go to the original box image if you have one), and slice it into three parts: a top that is a bit taller than the sidebox heading (probably 25px), a bottom that is just tall enough to hold the curves (16px), and a middle with both straight side borders. Save them as (for example) sidebox_top.gif, sidebox_bottom.gif and sidebox_middle.gif, in /includes/templates/your_template/images/.

Then add to your stylesheet

.leftBoxContainer {
    background: url(../images/sidebox_bottom.gif) no-repeat bottom center;
    padding-bottom: 16px;
    }
.leftBoxHeading {
    background: url(../images/sidebox_top.gif) no-repeat top center;
    }
.sideBoxContent {
    background: url(../images/sidebox_middle.gif) repeat-y;
    }