::after pseudo-element generated content z-index stacking order

[kerbe]

So I have \[code\]<div id="generated">\[/code\] with a "Hello World" text node within it.After messing around with the \[code\]::after\[/code\] pseudo-element and z-index I came across something I couldn't understand.See FiddleCurrently, the \[code\]#generated\[/code\] div has a z-index of 1 while the pseudo-element has a -1 z-index but only the divs text-node is shown, instead of the div appearing above the generated-content. Also, if I give the pseudo-element a positive z-index and the div a greater z-index the \[code\]<div>\[/code\] remains behind the pseudo-element.Example I can't quite understand how the stacking context works with generated content .. Can anyone shine light on this?