Android Webkit: Absolutely positioned elements don't respect z-index

Question

Nasty little bug, this one.

As illustrated in Android ticket 6721, the Android browser seems to not respect z-index when absolutely positioned elements are laid over

Answer 1

IE has this same problem and the solution there is to make sure that every element that is involved in the positioning and even their containers have a z-index applied to them. Basically if you add a z-index to 1 element in the dom then IE gets understands its z position but doesn't understand its z position relative to what its next to and/or over.

container - z-index 0
child (on top container) - z-index 1
child 2 (above all) - z-index 999

Of course this is all based on stupid IE but its worth a try in android also.

---

Second Try :)

I am not familiar with the android browser at all, but I hope to maybe lead you down a path to solve your issue. Superfish is a javascript menu that has implemented a solution for z-index menu items when they drop down over select boxes in browsers. BgIframe is the js that they use to achieve this. Your answer may lie there, hopefully.

http://users.tpg.com.au/j_birch/plugins/superfish/#sample2