homepage Welcome to WebmasterWorld Guest from 54.242.140.11
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / WebmasterWorld / Webmaster General
Forum Library, Charter, Moderators: phranque

Webmaster General Forum

    
Need help with image in background
How do I do this
Daily Sparring

10+ Year Member



 
Msg#: 5599 posted 12:51 am on May 22, 2004 (gmt 0)

I have the following code:

<table width="780" height="236" border="0" cellpadding="0" cellspacing="0" background="images/myimagehere.jpg">

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

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 5599 posted 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

10+ Year Member



 
Msg#: 5599 posted 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">&nbsp;</td>
<td width="13%">&nbsp;</td>
<td width="81%" class="title3">I WOULD LIKE SOME HELP</td>
</tr>
<tr>
<td>&nbsp;</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

10+ Year Member



 
Msg#: 5599 posted 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:

<link rel="stylesheet" href="style.css">

and you table cell would be:

<td class="bg">

Daily Sparring

10+ Year Member



 
Msg#: 5599 posted 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

10+ Year Member



 
Msg#: 5599 posted 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

10+ Year Member



 
Msg#: 5599 posted 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>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p></td>
</tr>
</table></td>
</tr>
</table>

Daily Sparring

10+ Year Member



 
Msg#: 5599 posted 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>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p></td>
</tr>
</table></td>
</tr>
</table>

jo1ene

10+ Year Member



 
Msg#: 5599 posted 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.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / WebmasterWorld / Webmaster General
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved