ブロガーのz-indexバグ

Question

私は新しいブロガーテンプレートを作成していますが、残念ながら私は問題に直面しています。 私がやろうとしていることの簡単な例。

<div class='container'> 
    <div class='slider'></div> 
    <div class='posts'></div> 
</div> 

デフォルトでは、2番目のdiv（posts）は最初のものよりも高いzインデックスを持つ必要があります。 see this demo とthis picを参照してください。何をする必要がありますかを参照してくださいhere 、何が問題なのですか。 はここにある私のblog

Answer 1

持つには明らかz-index高い、要素のいずれか

他の要素の後
1. または
2. 持っている必要がありますposition:relative;または前の要素が相対/絶対位置を持っている場合、絶対。あなたのケースでは

.d1{ 
 
    width: 100%; 
 
    height:50px; 
 
    background: tomato; 
 
    position: relative; 
 
} 
 

 
.d2{ 
 
    width:80%; 
 
    height:200px; 
 
    background: blue; 
 
    margin: -30px auto 0 auto; 
 
    position: relative; /* Try removing this - it will be 'below' d1 because d1 has position:relative; */ 
 
}

<div class='container'> 
 
    <div class='d1 slider'></div> 
 
    <div class='d2 posts'></div> 
 
</div>

、これはposition:relative;.containerにクラスを追加することを意味します。