Hey Guys,

 

I'm completely stuck on a problem regarding the re-design of my sites new template, as I've cried about on my blog.

 

The jist of it is that I've set a container to contain the text:

 

#containerStandard {

background-image: url(../layout/bg.png);

background-repeat: repeat;

/*margin-left: 100px;*/

position: absolute;

/*left: 100px;

top:300px;*/

width: 565px;

height: 521px;

}

 

I thought that with the size defined in width and height it would automatically shift the footer down as the footer is another div tag that is placed at the bottom of my page:

 

#footer {

background-image: url(../layout/design3/images/footer.png);

width: 1024px;

height: 72px;

 

position: absolute;

left: 100px;

top: 684px;

}

 

Here's a screen shot of the problem

 

I want it so that as the container becomes larger (vertically) the footer will continue to remain beneath the container that I've created and "move-along" with the container as it's height increases.

 

I tried to make it float both left and right, but the footer then just pushes off to the very top left and right of the page.

 

Where am I going wrong?

 

Your help will be most appreciated.

 

If you need any more details or something, just let me know and I will reply asap.

Hey Guys,

 

I'm completely stuck on a problem regarding the re-design of my sites new template, as I've cried about on my blog.

 

The jist of it is that I've set a container to contain the text:

 

 

 

I thought that with the size defined in width and height it would automatically shift the footer down as the footer is another div tag that is placed at the bottom of my page:

 

 

 

Here's a screen shot of the problem

 

I want it so that as the container becomes larger (vertically) the footer will continue to remain beneath the container that I've created and "move-along" with the container as it's height increases.

 

I tried to make it float both left and right, but the footer then just pushes off to the very top left and right of the page.

 

Where am I going wrong?

 

Your help will be most appreciated.

 

If you need any more details or something, just let me know and I will reply asap.

 

Hey, although i don't understand 100% clearly i think what your trying to achieve is header - content - footer. You shouldn't need to specify the height of your container in order to get the footer to place underneath.

 

<div id="container>

Text

</div>

<div id="footer">

Text

</div>

 

Perhaps another problem is with the position absolute, you should look for a way around using this as it could be the problem, setting your footer 684px from the top means that even with content in the container it will still be displayed there, because that is what you have told the element to do.

Hey, although i don't understand 100% clearly i think what your trying to achieve is header - content - footer. You shouldn't need to specify the height of your container in order to get the footer to place underneath.

 

<div id="container>

Text

</div>

<div id="footer">

Text

</div>

 

Perhaps another problem is with the position absolute, you should look for a way around using this as it could be the problem, setting your footer 684px from the top means that even with content in the container it will still be displayed there, because that is what you have told the element to do.

 

Hi J.P,

 

thank you for your reply, I will remove the absolute and the positioning pixels for the footer and remove the height of my container, will I still have to specify the width though?

 

Thanks again for your reply.

 

Kind Regards,

Ren

Yes the width will still have to be set.