How do I get my footer to move in relation to my expanding main content?

If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

How do I get my footer to move in relation to my expanding main content?

Hello, am building my first site at the moment and am strugglin to move the footer in relation to my main content which expands and contracts with the amount of content in it. iv tried a couple of things with no luck, any help you can give me would be much appreciated!

excuse any rookie mistakes am using a combo of online tutorials and dreamweaver to get my code!

I would say it is because you have a min-height of 60% on your main content div and if your actual content takes up less than 60% of the screen height then it will appear that your footer is not moving up to meet the bottom of the content. Add a border to your main content div and you will be able to see if that is the case (obviously the border will need removing afterwards).

I would also like to recommend you move your relative and absolute positioning as they are not required (nor is the z-index) on the layout you have. Just replace top: 150px with margin-top: 150px.

Thanks for the response Pixie, its haven't really got the issue with the footer moving up to meet the main content, am quite happy for it to be sat at the bottom of the page, the issue I have is the main content when filled with text to expand it beyond 60% covers over the footer, I need a way of having the footer move with the content when it extends beyond 60%, he is a Pictures so you can see what am talking about.

Also thanks for the suggestions regards the z-index and relative/absolute positioning, I did try to remove them, but divs on the site move all over the place and I dont have enough experience to place them correctly without them.

Hi Pixie, thanks for the response, the issue I have isnt so much the footer moving up to meet the content (am quite happy for it to sit at the bottom of the page when the main content is at 60%) its when the content expands beyond 60%, it covers over the footer rather than moving the footer in relation to it, here is a Picture so you can see what am talking about.

Also thanks for the advice on the z-index and rel/abs positioning, I did have a try at removing them but the divs just moved all over the place and I dont have enough experience to keep the divs in place another way

Your problem is definitely all the absolute positioning you're doing...

You can fix most of your problems by moving all the styles that are on the main content on to the page wrap element, then your nav is inside the white area to begin with, then it's just a matter of centring the navigation.