DIV overlap IMG IE 8

I'm using a div with position: fixed to overlap an image. This works fine in firefox, but not in IE8. The div just sits below the image, even if I play with the top开发者_如何学Python and left parameters.

Example of my Problem

Is this a known bug?

---

This is not the only way but should give you good starting point at least.

http://jsfiddle.net/lollero/EREc7/ - Parent element that has position: relative; makes sure that the element with position: absolute being the overlapping div would stick with the image no matter where you put the image.

http://jsfiddle.net/lollero/EREc7/1/ - The same with border

---

You can also do something like this:

position: relative;
z-index: 4 /* The higher the number the higher the element is. make sure to*/
top: -50px;
left: 0px;

---

And something like this:

http://jsfiddle.net/lollero/EREc7/3/

---

Note that the first one is the most flexible one.

---

Here's a bit bigger example

http://jsfiddle.net/lollero/EREc7/4/

---

Examples from the comments:

http://jsfiddle.net/lollero/nBk79/1

http://jsfiddle.net/lollero/nBk79/6/

---

Use z-index if you're talking about layering over one another. Then you can adjust them where you want and put one on top of the other.