Two backgrounds in a table?

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
Shaneckel
Forum Commoner
Posts: 48
Joined: Fri Sep 23, 2005 3:46 am
Location: Pittsburgh, PA

Two backgrounds in a table?

Post by Shaneckel »

I have a table that has a stretching 1 pixel background and a 40 pixel picture to idol at the top. Then entire table is static horizontal, but stretchs vertically 100%.

Now what I'd like to do is have a stretching background to this table as well as having a picture in the background. I wish to put the text content ontop of both.

I am stumped and any ideas would be grateful.

If this is too confusing text, I can put up a root soon.
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

Nested containers. For example a div around a table. The div has the stretched background, the table has the positioned picture.
Shaneckel
Forum Commoner
Posts: 48
Joined: Fri Sep 23, 2005 3:46 am
Location: Pittsburgh, PA

Post by Shaneckel »

Code: Select all

<div background="blah stretch">
    <table img src="blah static" valign="top">
    </table>
</div>
I'm really bad at code, typically I have shiznatix do it. but I think he's drunk.
User avatar
Luke
The Ninja Space Mod
Posts: 6424
Joined: Fri Aug 05, 2005 1:53 pm
Location: Paradise, CA

Post by Luke »

I prefer CSS (your html was syntactically incorrect anyway)

Code: Select all

<div style="background: url(image/stretch.gif)">
    <table style="background: url(image/positioned.gif)" valign="top">
    </table>
</div>
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

Shaneckel wrote:typically I have shiznatix do it. but I think he's drunk.
:lol: :lol: :lol:

Doesn't sound like shiz 8O :twisted:
User avatar
JayBird
Admin
Posts: 4524
Joined: Wed Aug 13, 2003 7:02 am
Location: York, UK
Contact:

Post by JayBird »

FYI, you can have 2 backgrounds using CSS like this

Code: Select all

div.test {
	background-image: url(../pix/logo1.gif), url(../pix/picture2.gif);
	background-repeat: repeat-y;
	background-position: top left, top right;
	width: 385px;
	height: 100px;
	border: 1px solid #000000;
}
This only works in Safari thought at the moments...GO OS X!!! :wink:
Shaneckel
Forum Commoner
Posts: 48
Joined: Fri Sep 23, 2005 3:46 am
Location: Pittsburgh, PA

Post by Shaneckel »

That would work on about 20 computers in the world.

but I need this to work on all computers.
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Post by JellyFish »

Feyds concept and Ninja Goats solution seems like a way to go.

Code: Select all

<div style="background: url(http://forums.devnetwork.net/images/smiles/icon_exclaim.gif)">
<table style="background: url(http://googel.com/images/logo.gif) no-repeat;" valign="top">
<tr>
<td>
<b>Text is above it. Bahahahahahahahahaha</b>
<br>
<br>
<br>
<br>
<br>
</td>
</tr>
</table>
</div> 
Try it here.
Shaneckel
Forum Commoner
Posts: 48
Joined: Fri Sep 23, 2005 3:46 am
Location: Pittsburgh, PA

Post by Shaneckel »

http://www.shaneckel.com/New/shane.htm

I didn't think about it, and now I don't know if this is possible but I need to add two backgrounds to a cell. I don't think the div trick will work for that.

If you have any suggestions on where to start on rewriting this site, I'd appreciate the help. It's just a photoshop cut-out.
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

What's going in this cell?
Shaneckel
Forum Commoner
Posts: 48
Joined: Fri Sep 23, 2005 3:46 am
Location: Pittsburgh, PA

Post by Shaneckel »

include. so other php files.
Shaneckel
Forum Commoner
Posts: 48
Joined: Fri Sep 23, 2005 3:46 am
Location: Pittsburgh, PA

Post by Shaneckel »

problem solved, Thanks a million.

I decided to put the div inside the cell and give it a size.

Yaa I'm learning.
User avatar
shoebappa
Forum Contributor
Posts: 158
Joined: Mon Jul 11, 2005 9:14 pm
Location: Norfolk, VA

Post by shoebappa »

JayBird wrote:FYI, you can have 2 backgrounds using CSS like this

Code: Select all

div.test {
	background-image: url(../pix/logo1.gif), url(../pix/picture2.gif);
	background-repeat: repeat-y;
	background-position: top left, top right;
	width: 385px;
	height: 100px;
	border: 1px solid #000000;
}
This only works in Safari thought at the moments...GO OS X!!! :wink:
Is this a standard? I hadn't seen that but it'd be killer to not have to use nested divs to accomplish the same thing. Does the background-repeat work the same way?
Post Reply