Log in

View Full Version : background image?


CSS59
03-04-2006, 03:57 AM
How would I do something like the background of this (http://www.automation.com/ ) for my forums?

My with (http://cobaltss.net) is set for 90% but I want to add a left and a right image in the bg?

Thanks for the help

Princeton
03-04-2006, 06:21 PM
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
03-06-2006, 07:32 PM
How would I do something like the background of this (http://www.automation.com/ ) for my forums?

My with (http://cobaltss.net) 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
03-11-2006, 05:01 AM
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
07-03-2006, 03:05 AM
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
07-03-2006, 03:44 AM
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.