I need a little help with a floating div, or making it static.

[Shaun]

Hi there,

I was wondering if someone could help me out here.

 

on my page http://shacow.com/dev.html

I have an image that is supposed to be fixed to the bottom of my main div,

 

the idea is, when their is more text on that page, and it become scrollable the image will stay in its place and the text will scroll without the image moving.

 

but for some reason that isnt working.

 

ive tried

 

#foldingathomeprogress {

text-align: center;

display: block;

position: fixed;

 

}

 

I hope someone can help me because this is driving me insane

 

you can view my style sheet at http://shacow.com/shacow.css ???

 

thank you all, Shaun

[Shaun]

anyone?

[liamloveslearning]

what is the footer meant to say in it?

 

© Copyright Shaun Cowley Photography. All rights reserved.

 

?

[liamloveslearning]

if you move the div containing the image in, so its no longer at the bottom of the text, but contained in the div holding the copyright text it should work, like so

 

<div id ="legalnotice"><a href="legalnotice.html">© Copyright Shaun Cowley Photography. All rights reserved.</a>
<div id="foldingathomeprogress"><img src="./fahbar/fahunitprogress.php" alt="Folding@Home Work Unit progress." /></div>
</div>

[Shaun]

Hi Liam, thanks for the reply but I want the div that has the image to be placed where it currently is, not in the legal notice. .. If you load the page without scrolling you will see where i want it placing and where it should remain while the rest of the page scrolls.

 

I hope this helps,

 

thank you, Shaun

[liamloveslearning]

try replacing your css foldingathomeprogress with

 

#foldingathomeprogress {
display:block;
text-align:center;
position: absolute;
left: 670px;
top: 481px;
}

[liamloveslearning]

then you need to add padding to the bottom of the container div so the text doesnt scroll beneath it

[Shaun]

Thank you liam. I have applied the changes to the link above and it seems to be working pretty good. The only problem is that the image seems to be placed to far to the right for some strange reason.. I was hoping to have it entered. also, do you know how to do the padding?

 

many thanks, Shaun

[liamloveslearning]

if its too far to the right adjust the

left: 670px;

to a small value, and to add the padding select the mccontentch div and add padding-bottom: (ENTER A VALUE HERE); until its clear of your div

 

[Shaun]

Thank you Liam. It is working perfectly!

[Shaun]

Hi Liam. Ive just noticed that the images possition breaks depending on if the browser is resized or maximised... do you know how to fix this?

 

 

many thanks, Shaun

[liamloveslearning]

it shouldnt move as its positioned to the parent div (the div that is wrapped around your image div "if this makes sense?") lets see your page link and ill have a look