Positioning Error in IE

and display footer above a video

[viggen]

Hi folks, what i am posting below means little to me, i am not a coder at all but speak english, my coder doesnt, so here it goes, if you need any more information or what to see the url of the website, i am happy to provide the url via sticky mail...

The issue is there is an image that is at the end of the screen fixed and when scrolling it stays there, all works well in fireforx or safari but not in IE

the code is

<div id="footer">
<img src="http://www.mydomain.com/images/footer.png"/>
</div>

In CSS the Layer is apparently:
div#footer {bottom:0; position:fixed; z-index:5;}

any help would be greatly appreciated...

cheers and many thanks

[alt131]

Hi viggen,

What version of intenet explorer is causing problems?
I ask because that code works as descibed in a simple test page for ie7 and ie8. ie6 does not understand position:fixed, so it won't work in that version.

[viggen]

I am using IE8 and the images is in the center and not at the bottom i am happy to stick you the url if you need to see it yourself?

[alt131]

Hi viggen, so first thought there is something else in the code affecting this. Feel free to sticky me the url and I'll take a look and bring back the relevant code.

[alt131]

Ok, the issue is that the desired display is for div#footer to be fixed to the bottom of the viewport, and to display above a video. There are two key problems:
1. div#footer is positioned part-way down the viewport (rather than the bottom) and
2. is being painted underneath the video.
The document is in quirks mode and the code for the video is:

<object width="642" height="394">
<param name="movie" value="http://www.youtube.com/v/_5M3rtOKsqA
fs=1&amp;hl=de_DE&amp;rel=0&amp;color1=0x5d1719&amp;color2=0xcd311b"></param>
<param name=”wmode” value=”transparent”>
<param name="allowFullScreen" value="false"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/_5M3rtOKsqA?fs=1&amp;hl=de_DE&amp;rel=0&amp;color1=0x5d1719&amp;color2=0xcd311b" wmode="transparent" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="642" height="394"></embed>
</object>

Viggen, I suggest you encourage your coder to validate the code - there are some interesting errors in the html and css that won't be helping.

For the problems:
No #1 is fixed by providing a full doctype so the document is in standards (not quirks) mode.
No #2: In the past I've been able to fix it by changing the wmode from transparent to opaque, but I can't test that here because (for some odd reason) the video won't download and display in ie. However, if you wish to try at your end to see if it works I mean:
In the object: <param name=”wmode” value=”opaque” />
In the embed, wmode="opaque"

[viggen]

thank you very very much, problem now solved! :)

[alt131]

Thanks for that viggen - and I have to say the backstory makes this outcome really pleasing: You had concerns about code, the person coding didn't have english, I lack enough other languages and couldn't reproduce the technical issue.

So we ignored all that and jumped straight to the desired outcome instead. ;)