How do I lock and image to bottom, under text

Forum Moderators: not2easy

Message Too Old, No Replies

How do I lock and image to bottom, under text

Multiple Background Tags?

Echo419

5:01 pm on Feb 19, 2006 (gmt 0)

I am trying to lock a logo to the bottom right of a page, how can I go about doing this when I have already used the background tag for the background image.

Robin_reala

5:25 pm on Feb 19, 2006 (gmt 0)

At the moment you can only have one background image per element. You could either add a container <div> in around your content and set your logo as the background image on that, or you could apply your normal background to <html> and the logo to <body> (not sure how backwardsly compatible that is).

Echo419

5:41 pm on Feb 19, 2006 (gmt 0)

Alrite well how would i go about that. I just need 1 tiling background image. and then i need 1 nested image in the bottom right behind the text.

Robin_reala

5:44 pm on Feb 19, 2006 (gmt 0)

Well, something like:

html { background: url(tile.png) repeat 0 0; }
body { background: url(logo.png) no-repeat 100% 100%; }

If you want to go the containing <div> method then given the HTML:

<body>
<div id="container">...contents...</div>
</body>

you'd want:

body { background: url(tile.png) repeat 0 0; }
#container { background: url(logo.png) no-repeat 100% 100%; }

Something you didn't mention is whether you want the logo to appear at the bottom of the page or at the bottom of the viewport. If it's the viewport you want then you'll have to change your CSS to add in a fixed attachment:

background: url(logo.png) no-repeat fixed 100% 100%;

Echo419

6:13 pm on Feb 19, 2006 (gmt 0)

Yes i need a tiling background, and an image that locks to the bottom right of the viewport.