Need help with image in background

Forum Moderators: phranque

Message Too Old, No Replies

Need help with image in background

How do I do this

Daily Sparring

12:51 am on May 22, 2004 (gmt 0)

I have the following code:

I have text over top of this image, but the more text I type, if I go past a certain height (236) the image starts to repeat. What I would like it to do is stretch down with the text. Any ideas? Thanks in advance.

PatrickDeese

12:54 am on May 22, 2004 (gmt 0)

The only thing you can do is make the image longer than any of you pages so the image never "runs out" - or make the image repeat seamlessly.

Daily Sparring

1:19 am on May 22, 2004 (gmt 0)

The problem is that I tried that and the image still repeats. Here is the entire table. Please help. It is very frustrating.

<table width="780" height="330" border="0" cellpadding="0" cellspacing="0">
<tr valign="top">
<td width="341" height="330"><img src="images/noname2.jpg" width="341" height="330"></td>
<td width="440" height="330" background="images/noname.jpg"><table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="6%" height="70"> </td>
<td width="13%"> </td>
<td width="81%" class="title3">I WOULD LIKE SOME HELP</td>
</tr>
<tr>
<td> </td>
<td colspan="2" valign="top" class="bod"><span class="sub3">Lorem
ipsum dolor sit amet, consectetuer adipiscing elit</span><br>
<br>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
nonummy nibh commodo consequat. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit, sed diam nonummy nibh commodo consequat. <br>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem
ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy
nibh commodo consequat. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit, sed diam nonummy nibh commodo consequat. Lorem ipsum dolor
sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit, <br>
ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit, Lorem ipsum dolor
sit amet, consectetuer adipiscing elit, sed diam nonummy nibh commodo
consequat. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
nonummy nibh</td>
</tr>
</table></td>
</tr>
</table>

jo1ene

1:50 am on May 22, 2004 (gmt 0)

I used to have one on my site. You use a style sheet and add the class attribute in the cell that you want the background. So your style sheet would be:

.bg {
background-image: url(images/whatver.jpg);
background-repeat: no repeat;
}

and you link the style sheet:

and you table cell would be:

Daily Sparring

2:34 am on May 22, 2004 (gmt 0)

How do I format that to fit where the current images are placed. I have a little understanding of .css, but mostly test based. Thanks again.

jo1ene

1:04 pm on May 22, 2004 (gmt 0)

Ok I looked over your sample code a little more carefully. You referenced a <td class="bod"> in your sample code. In your case:

.bod {
:::whatever you already have:::
background-image: url(images/noname.jpg);
background-position : top left;
backgound-repeat: no-repeat;
}

Try this.

Daily Sparring

2:24 pm on May 22, 2004 (gmt 0)

Thanks, it is almost there, but the image still repeats using that code. Anything else? It is a small news header image that I would rather just have either stretch from or not repeat.
<table width="780" height="330" border="0" cellpadding="0" cellspacing="0">
<tr valign="top">
<td width="341" height="330"><img src="images/leftimage.jpg" width="341" height="330"></td>
<td width="440" height="330" ><table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td colspan="" align="left" valign="top" class="bod"><p><span class="sub3">Lorem
ipsum dolor sit amet, consectetuer adipiscing elit</span><br>
<br>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed
diam nonummy nibh commodo consequat. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit, sed diam nonummy nibh commodo consequat. <br>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem
ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy
nibh commodo consequat. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit, sed diam nonummy nibh commodo consequat. Lorem ipsum dolor
sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit
amet, consectetuer adipiscing elit, <br>
ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit, Lorem ipsum dolor
sit amet, consectetuer adipiscing elit, sed diam nonummy nibh
commodo consequat. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
sed diam nonummy nibh</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p></td>
</tr>
</table></td>
</tr>
</table>

Daily Sparring

2:24 pm on May 22, 2004 (gmt 0)

jo1ene

7:53 pm on May 22, 2004 (gmt 0)

I just tested the code I gave you and it works here in IE but not in Mozilla or Firefox. So there you have it. That must be new because it worked before, for sure. Sorry I couldn't help you. The other thing I do is keep a standard length on all my pages.