CSS assistance please 1

[ARiSAR99]

I have a page I need help with:

http://www.publicsquarebooks.com/indextest.html

I am trying to get the left side graphic to continue down the page with a background image. Here is the css code:

<style type="text/css">
.Leftback1 {
background-image: url(LeftBG.jpg);
background-repeat: repeat-y;
}
</style>

and my <td> tag:

<td rowspan="2" class="Leftback1">

and the bg image:

http://www.publicsquarebooks.com/LeftBG.jpg

What am I doing wrong?

Thanks in advance.

 

[tviman]

You need to put a background in the table cell:

<td background="images/image.jpg>

You need to create an image for the background. Also - and this is important - you'll need to nest your page content within this table cell.

Oops, I'm following your lead - you can also create a div with a background image and forego the content nesting.

There's always a better way. The fun is trying to find it!

 

[gacaccia]

what's the problem? the graphic appears to be going down the page fine in both ie6 and ns6.

glenn

 

[ARiSAR99]

It seems to be a problem with the Height rather than the css. I cludged the Content Table cell with <br>'s to make it longer than the left side, but how can I make the left side go to the bottom of the page no matter how big the content section is?

see:

http://www.publicsquarebooks.com/testindex2.html

Thanks for your replys.

 

[tviman]

I looked at the LeftSide.jpg image. It's 600 px. high. and is controlling the height of your table. (Change the border value to 1 and you'll see what I mean.)

In order to do what you want, you'll need to do 1 of two things: either place LeftSide.jpg in a master table...

<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td valign="top" class="Leftback1"><img src="LeftSide.jpg" width="71" height="600" alt="" border="0"></td>
<td>

<table width="100%" cellpadding="0" cellspacing="0" border="0">

rest of your content...

</table>
</td></tr>
</table>
<div align="center"><font face="Verdana" size="1" color="White"><b>Copyright 2004 &copy; Public Square Books</b></font><br><br><br></div>

or place a div in a z-layer and give it a class like "Leftback1".



There's always a better way. The fun is trying to find it!

 

[ARiSAR99]

Thanks, that'll do it!