View Full Version : fixed image that always stay on screen & ie6

06-03-2010, 09:44 PM
i have been using this code since a long time to display an image that always stay on a fixed position on the screen even if you scroll down the page.... but i just noticed it doesn't work under internet explorer 6 (but it works with ie8)

is there a way to make it work for ie6 ?

<a id="inscrit" href="...">...</a>

a#inscrit {
position: fixed;
left: 0;
bottom: 0;
display: block;
height: 220px;
width: 385px;
background: url(joinus2.gif) bottom left no-repeat;
text-indent: -999em;
text-decoration: none;
-khtml-opacity: 0.85;
opacity: 0.85;
z-index: 10;

thanks a lot!

06-03-2010, 09:48 PM
There is some IE6 help here. (http://www.exitfegs.co.uk/Sources.html) Middle column.

Use the Search facility.


06-03-2010, 09:59 PM
can you link me to a specific article or something... there are too many articles on this page and i'm not even sure i will find what i need...

i dont even know how an image that always stay on the screen is called in the "technical image" so i dont know what to search for... thats why i came here

06-03-2010, 10:16 PM
Fixed images and IE 6 can get tricky mainly because IE6 doesn't support position: fixed but there are ways to get it to work. The problem is now anything that is position:absolute becomes position:fixed so you can't really rely on position:absolute for everything.


06-03-2010, 10:30 PM
THANKS A LOT !!!! YOU SAVED MY LIFE !!! I love you :)

i had this damn bug on 5 different websites

06-03-2010, 10:51 PM
hmmm i think i talked too fast

it is working btu its very weird... the image will not always stay fixed on the bottom left of the screen like on that website you gave me...

on my website the image will moove to the corner only when i move the mouse over it

take a look by yourself it's really weird

example here (use internet explorer 6 to see the bug)

do you know where it comes from ?

06-03-2010, 11:43 PM
also its weird now i have a double scrollbar, there is another scrollbar hidden behind the IE scrollbar... its weird because it doesnt have this bug on the cssplay page

anyway if i can only get the fixed images to work i will be happy !!

06-04-2010, 12:08 AM
Are you using overflow: auto; anywhere?

06-04-2010, 12:18 AM
not on the image i am trying to fix on the screen

but i did put "overflow-y:auto;" in the body tag like they said on the page

here's my body css:

margin: 5px 0px 0px 0px;
padding: 0px;
background: url(http://www.pirate-punk.net/bg/ppbg.gif)
background-position: center bottom;
background-attachment: fixed;
background-color: #000000;

and my fixed image css:

a#inscrit {
position: fixed;
position: absolute;
left: 0;
bottom: 0;
display: block;
height: 220px;
width: 355px;
background: url(inscrit-toi_corner.gif) bottom left no-repeat;
text-indent: -999em;
text-decoration: none;
-khtml-opacity: 0.75;
opacity: 0.75;
a#inscrit:hover {
-khtml-opacity: 1.0;
opacity: 1.0;


06-04-2010, 12:30 AM
Okay I see. You have a top margin on your body which creates that extra scrollbar because the height is 100% so its 100% of the viewing window plus 5px. Remove the top margin and add it elsewhere.

06-04-2010, 01:27 AM
no, still same problem even without margin :/ it looks like my website is inside an iframe

and the fixed image doesn't work neither... check this page on IE6:

the image moves only when you put mouse pointer over it

i have same problem on http://www.anarcho-punk.net

06-04-2010, 03:03 AM
Ahh. You are missing this

<!--[if lte IE 6]>
<style type="text/css">
html {overflow-x:auto; overflow-y:hidden;}

Add that in your html after your first stylesheet, not in it. Also <!----> is an invalid css comment.

06-04-2010, 03:18 AM
working, one of the scrollbars is gone but it's not the good one...

see here :


and i still have same problem with the fixed image :(

06-04-2010, 04:42 AM
Okay I'll be honest your code is mess. Bugs usually only work if the code is valid. Run your code through a validator. http://validator.w3.org

Fix your errors and come back. Chances are there will be a lot of errors. Good luck.