InsaneJournal

Tweak says, "music's played by the madman"

for beautiful you are my world (relevant) wrote in rp_tutorials,
@ 2010-10-17 02:01:00

Hello everyone! I've been searching around lately and I can't seem to figure out how to make a table with a pattern background under a solid table for text. An example of what I'm talking about can be found here. Thank you in advance!

(Post a new comment)

et_synecdoche
2010-10-17 06:59 am UTC (link)

If you only want one cell then the following should do the trick:

<table cellspacing="7" cellpadding="5" background="your pattern here"><tr><td bgcolor="white">TEXT</td></tr></table>

If you want to have multiple cells, then you should go for something more like this:

<table cellpadding="7" background="your pattern here"><tr><td><table bgcolor="white"><tr><td>TEXT</td></tr></td></tr></table>

I hope that helps!

(Reply to this)

stomps
2010-10-17 08:07 am UTC (link)

Ha, clicking that link was a trip. Unlike

et_synecdoche's (perfectly serviceable!) code, I used inline CSS:

Breakdown:
• the bgcolor in the initial TABLE tag is going to be covered by your pattern background, but I specified one in case someone has graphics turned off or my image stops working.
• background-attachment:scroll is going to make the image move as you page down; if you want the image to stay in a fixed position replace 'scroll' with 'fixed'.
• TD BGCOLOR needs to be specified in every cell; it's your solid color against the patterned image. Cellpadding and cellspacing are arbitrary numbers, but the bigger your cellspacing, the thicker/larger your background image will be.

I hope that helps! If you have Firefox you can always just highlight the area of code you want to look at, right-click and choose "View Selection Source". :]

(Reply to this)