I have a parent div with a background image that is positioned "center bottom".
background: url(http://in.musikdebu.com/images/bottom_page_background.jpg) no-repeat bottom center;
As child divs expand, lengthening the size of the parent div, the background image of the parent div doesn't position itself at the bottom in FF.
It works as I expected in IE6 & IE7. That is to say, the image appears at the bottom of the parent div as its length expands with the child div's length.
I have been looking for a solution for sometime. Can anyone tell me if there is a hack for this or am I simply doing something in an odd way?
You've got a few errors that
You've got a few errors that need to be addressed first. Your problem looks like a clearing float issue which I will try to help with. But first, I would recommend fixing the following errors:
-HTML element title is missing
-You inserted a style tag, but didn't define the type such as: style type="text/css"
-You used the h2 id "caption" twice---you have to use classes if you want to use the name twice
The few errors you mentioned are corrected
In my haste to dummy up this page I forgot a few things.
the page now has the HTML title element
the style tag is fully defined with type="text/css"
the use of h2 id="caption" is completely removed. It's not relavent.
Thanks for taking the time to look at this.
Looks like you got the
Looks like you got the clearing float thing Just fyi, you still have the following errors:
line 220 column 2 - Warning: anchor "page_photo" already defined
line 236 column 43 - Warning:
[Solved] Div's bottom positioned background image doesn't reposi
Thanks amadika. Your link http://www.positioniseverything.net/easyclearing.html helped solve my problem.