Background position bottom not working properly in firefox!

[wickywills]

Hi all,

I appear to be having a problem with what should be a VERY simple website design.

I have a background image that i have positioned at the bottom of the page, and i want that background image to ALWAYS appear at the bottom of the page (not just at the bottom of the lowest bit of content). An example of what i'm trying to achieve can be seen here:

http://www.wickywills.com/3dstuff/0003.asp

If you open the above link in IE6 and Firefox, you should see the difference straight away. IE6 behaves exactly how i would expect (and how i want it to), however Firefox just aligns the background image to the bottom of the visible window, and if you scroll down on that page, you will scroll past the background image - which should not be possible!

Not sure how it looks in IE7 since i don't yet have it installed (XP Service Pack 2 seems to make my PC really unstable!), but would appreciate it if someone tried it out in that as well.

Is there anyone who can help me on the above?

I just want to get a background positioned correctly at the bottom - don't mind at all if I break W3C standards to do so!

cheers
James

[wickywills]

Just solved my own problem :)

Instead of putting the background image on the BODY and aligning it bottom, i decided to put it on a "Container" div and set that div's "min-height" to 100% (you'll also need to do the BODY, HTML{height:100%}) to get this to work.

hopefully this has helped someone! (let me know if it has ;)

[Doc]

Originally Posted by TempUserNr2131124

Y-positioning with a "bottom"-value is a problem in Firefox. The solution is to first set height = "100%"! Example...

1. <script type="text/javascript">
2. //...For example you set the background in fram x to bottom-right...
3. bFn = getElementsByAttribute(top.frames[x].document,"body","bgcolor")[0];
4. bFn.style.margin = "0";
5. bFn.style.padding = "0";
6. bFn.style.width = "100%";
7. bFn.style.height = "100%"; // <<< important
8. bFn.style.backgroundRepeat = "no-repeat";
9. bFn.style.backgroundPosition = "right bottom"; //x y
10. </script>

You DO realize this is a nearly three year old thread, right?

[DaveSawers]

With a user name like that one, it's probably just another attempt to get enough posts in to start spamming the forums with irrelevant links.

[wige]

Thats my guess...

[Doc]

It would seem that the username was more temporary than they realized!