z-index value to positioned elementsFirst an example where (AP1 = AP2) > RP1, RP2
This is relatively positioned block, with z-index:10
This is absolutely positioned block, with z-index:15
Content between the RP blocks... Content between the RP blocks... Content between the RP blocks... Content between the RP blocks...
This is relatively positioned block, with z-index:12
This is absolutely positioned block, with z-index:15
Content after the second RP block... Content after the second RP block... Content after the second RP block... Content after the second RP block...
Another example where (AP1 = AP2) < RP1, RP2
This is relatively positioned block, with z-index:10
This is absolutely positioned block, with z-index:5
Content between the RP blocks... Content between the RP blocks... Content between the RP blocks... Content between the RP blocks...
This is relatively positioned block, with z-index:12
This is absolutely positioned block, with z-index:5
Content after the second RP block... Content after the second RP block... Content after the second RP block... Content after the second RP block...
Another example where RP1 < (AP1 = AP2) < RP2
This is relatively positioned block, with z-index:10
This is absolutely positioned block, with z-index:11
Content between the RP blocks... Content between the RP blocks... Content between the RP blocks... Content between the RP blocks...
This is relatively positioned block, with z-index:12
This is absolutely positioned block, with z-index:11
Content after the second RP block... Content after the second RP block... Content after the second RP block... Content after the second RP block...
If RP1 was 12, and RP2 was 10, all would still behave properly.
Amazing! This renders identically on all browsers.