г-индекс по абсолютному DIV

Question

JS Fiddle

У меня есть две дивов, A & B:

<div class="a"> 
    A 
</div> 
<div class="b"> 
    b 
</div> 

Я хочу ДИВ B быть за сОн А. Я не хочу, чтобы изменить порядок параметров разметки.

Я пробовал z-index, не повезло.

.a{ 
    background: gold; 
    height: 100px; 
    border-bottom: 2px solid red; 
    z-index: 99; 
} 
.b{ 
    background: blue; 
    position: absolute; 
    width: 100%; 
    height: calc(100% - 100px); 
    transform: translateY(-10px); 
    z-index: 98; 
} 

Answer 1

Просто измените Z-индекс -1 для класса б

.b{ 
    background: blue; 
    position: absolute; 
    width: 100%; 
    height: calc(100% - 100px); 
    transform: translateY(-10px); 
    z-index: -1; 
} 

Answer 2

Giving position: relative к 'а' будет исправить вашу проблему. demo

z-index будет работать только с position:relative.

.a{ 
    background: gold; 
    height: 100px; 
    border-bottom: 2px solid red; 
    z-index: 10; 
    position:relative; 
} 

.b{ 
    background: blue; 
    position: absolute; 
    width: 100%; 
    height: calc(100% - 100px); 
    transform: translateY(-10px); 
    z-index: 1; 
    top: 0; 
}