Z-Index Absolute positioning - Using Z-Index to always appear at the top when panel is behind

I am quite accustomed to CSS but I have a problem and would like to know if there is a solution.

If I have a div with relative positioning and z-index:2 and another div next to it with z-index:1. Is there a way to have an element in the second DIV ris开发者_JAVA百科e on top of the first. Z-index:3 will not do it because it is inside an element at z-index 2.

.div1 {
position:relative;
z-index:2
}
.div2 {
position:relative;
z-index:1
}
.inner element {
position:relative;
z-index:3
}

Any ideas.

Marvellous

Assuming I understood your question correctly - No, the element you want on top will have to have a higher z-index.

http://jsfiddle.net/Wgsqd/

You would have to use javascript to access the left and top coordinates of the relatively positioned element, and then set its position to absolute to free the element of its parent's z-index.

If you're using JQuery

var top = $(".inner").position().top();
var left = $(".inner").position().left();
$(".inner").css({
  position: "absolute",
  top: top,
  left: left
});