Why element with z-index 0 is shown above element with z-index 1

I have following code (example):

<div style="position: fixed">
  <div id="AAA" style="position: absolute; background-color: green; z-index: 1">AAA</div>
</div>
<div style="position: relative">
  <div id="BBB" style="position: absolute; background-color: red; z-index: 0">BBB</div>
</div>

For me it looks like AAA div should be shown over BBB div, because:

• they both have position specified and this position supports z-index
• AAA z-index (1) is higher than BBB z-index (0)

But in result HTML, BBB is shown over AAA. Why? Are there any document describing this behavior?