background image?

[CSS59]

How would I do something like the background of this for my forums?

My with is set for 90% but I want to add a left and a right image in the bg?

Thanks for the help

[Princeton]

you need to be more specific but this may help...

<table width="90%" border="0" cellspacing="0" cellpadding="0">
		<tr>
				<td>lcor_image</td>
				<td width="100%"><div align="center">header</div></td>
				<td>rcor_image</td>
		</tr>
</table>

OR

<table width="90%" border="0" cellspacing="0" cellpadding="0">
		<tr>
				<td rowspan="2" valign="top">lcor_image</td>
				<td width="100%" style="background:url(images/misc/go.gif)"><div align="center">header</div></td>
				<td rowspan="2" valign="top">rcor_image</td>
		</tr>
		<tr>
				<td width="100%"><div align="center">content goes here</div></td>
		</tr>
</table>

[DirectPixel]

Originally Posted by CSS59

How would I do something like the background of this for my forums?

My with is set for 90% but I want to add a left and a right image in the bg?

Thanks for the help

Can you paste some code to your site? princeton's method works effectively for traditional website, but if you want to minimize coding, page size, and end-user load time, you can create the same effect using CSS and two images.

[CSS59]

Originally Posted by DirectPixel

Can you paste some code to your site? princeton's method works effectively for traditional website, but if you want to minimize coding, page size, and end-user load time, you can create the same effect using CSS and two images.

from my header?

[silurius]

I want to accomplish the same thing. I have tried this, but to no avail:

1. Add to Main CSS

leftbg .bw1 {
  background: url(images/bg/bg-left.png) repeat-y 0% 0px;
}
rightbg  .bw2 {
  background: url(images/bg/bg-right.png) repeat-y 100% 0px;
}

.bgbody-wrap {
  margin: 0px 33px;
}

2. Add to end of header template

<div class="bw1"><div class="bw2"><div id="body-wrap">

3. Add to beginning of footer template

</div></div></div>

I admit my CSS skills are pretty lame, but there you have it. Anyone see my problem?

[tgillespie]

Your 100% middle div is going to blast past your outer divs. There are two things you can do.

Put the actual image in the left and right div. Just once, so the div cannot be compressed by the 100% div OR you can remove the 100% attribute from the center div and add width attributes to the left and right divs. The width being how wide the border image is.

Let me know if that helps.