PurpleLady711
Registered user
Registered: 05-2006
Location: Carolyn ~ Puget Sound
Posts: 45
Karma: 6 (+7/-1)
|
Reply | Quote
|
|
Triples or Layers Backgrounds
I've seen groups where they have them.
How do I make that work?
|
2/25/2008, 1:19 am
|
Link to post
Email PurpleLady711
PM PurpleLady711
ICQ
Blog
|
Lesigner Girl
Global Administrator
Head of Runboard staff
Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
|
Reply | Quote
|
|
Re: Triples or Layers Backgrounds
I don't understand what you're referring to, PurpleLady. Can you provide a link or two for examples?
|
2/25/2008, 2:20 am
|
Link to post
Email Lesigner Girl
PM Lesigner Girl
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10257
Karma: 272 (+331/-59)
|
Reply | Quote
|
|
Re: Triples or Layers Backgrounds
Hmmmm... I did a Google search for "triples backgrounds" and came up with this site. Is this the sort of thing you are asking about?
|
2/25/2008, 2:38 am
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|
Lesigner Girl
Global Administrator
Head of Runboard staff
Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
|
Reply | Quote
|
|
Re: Triples or Layers Backgrounds
Ah, I've seen a few boards that do that, although I'd use divs instead of tables.
If that's what you're wanting, you could try:
Beginning of HTML header:
<div id="outerlayer">
<div id="middlelayer">
<div id="innerlayer">
End of HTML footer:
</div></div></div><!-- end layer divs -->
CSS:
#outerlayer {
border: 4px double #cccccc;
background: #cccccc url(url_to_outer_background.jpg);
padding: 30px;
}
#middlelayer {
border: 4px double #cccccc;
background: #cccccc url(url_to_middle_background.jpg);
padding: 30px;
}
#innerlayer {
border: 4px double #cccccc;
background: #cccccc url(url_to_inner_background.jpg);
padding: 5px;
}
The hex code after background: should match your background image, to make a nice transition while the background image is loading for those of us on dialup.
Change url_to_whatever_background.jpg to the url of your background images.
Adjust the borders and padding to suit.
If you want to restrict the width of the entire thing, define that in #outerlayer like so:
#outerlayer {
border: 4px double #cccccc;
background: #cccccc url(url_to_outer_background.jpg);
padding: 30px;
width: 912px;
}
You actually need to subtract the padding plus border, times two, to get the right width. For example:
912 "width"
+ 60 (30×2)
+ 8 (4×2)
980
...so from border edge to border edge, this would result in a 980px-wide outer background.
Last edited by Lesigner Girl, 2/25/2008, 3:25 am
|
2/25/2008, 3:19 am
|
Link to post
Email Lesigner Girl
PM Lesigner Girl
Blog
|
PurpleLady711
Registered user
Registered: 05-2006
Location: Carolyn ~ Puget Sound
Posts: 45
Karma: 6 (+7/-1)
|
Reply | Quote
|
|
Re: Triples or Layers Backgrounds
Yes, that's what I'm talking about.
Thanks, I will go play and see what happens.
And yes, Backgrounds by Marie is a good example of what I mean.
|
2/26/2008, 1:05 am
|
Link to post
Email PurpleLady711
PM PurpleLady711
ICQ
Blog
|
Lesigner Girl
Global Administrator
Head of Runboard staff
Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
|
Reply | Quote
|
|
Re: Triples or Layers Backgrounds
It's our pleasure, PurpleLady.
|
2/26/2008, 1:32 am
|
Link to post
Email Lesigner Girl
PM Lesigner Girl
Blog
|
Pastor Rick
Moderator
Registered: 07-2005
Location: Texas
Posts: 10257
Karma: 272 (+331/-59)
|
Reply | Quote
|
|
Re: Triples or Layers Backgrounds
You're most welcome PurpleLady711,
Glad I could help out
|
2/26/2008, 1:52 am
|
Link to post
Email Pastor Rick
PM Pastor Rick
Blog
|