View Full Version : Right Floated image even on scroll

11-06-2009, 06:27 PM

I'm trying to float an image to the right centre vertical aligned out side of my main page container so it butts up to the scroll bar.

However I also want this image to stay floated vertically on the page even when the page is scrolled down.

I've seen it done before but can't remember on what sites the closest I can find to an example is the auto scroll box on the right of the following page.

As the page scrolls down the auto scroll box goes with it. Now I don't need anything as complex as this as its just a single <a> and an image I just need to make it sticky to the right border and move down with the scroll.

11-06-2009, 07:49 PM
Hello hinch,
A little harder to find because you styled it inline ...
In your markup change <div id="scroll" style="position: absolute;> to <div id="scroll" style="position: fixed;>

11-07-2009, 01:25 PM
ok spot on for maintaining position now slight problem how to get it to fix to the right margin without moving up/down when the browser is resized.

<div style="position:fixed;margin-top:17%;">
<?php if ($_SESSION['userid']) { ?>
<a href="index.php?p=register"><img src="images/youhaveacard.jpg" border="0" /></a>
<?php } else {?>
<a href="index.php?p=upgrade"><img src="images/youdont_haveacard.jpg" border="0" /></a>
<?php } ?>

thats what i'm using at the moment you can ignore the php bits thats just because I need to display a different image depending on if you're logged in or not.

If you need to know the image's are 150x300 dimensions.

11-07-2009, 01:28 PM
ignore that one forgot we'd swapped position to fixed i was trying to use margin-right and wondering why it wasn't working using right:0px; solves the issue :)