このZ値がモダール（カラーボックス）の下にあるdivはなぜですか？

Question

私はモーダル（カラーボックス）が開いていてもdivを表示しようとしています。私がしたのは、私はZインデックスを高く設定したのですが、私は運がなかったのです。何かご意見は？

Here's the link

コード：

<div id="facebooklike" class="facebooklike"> 
    <div class="facebookinner"> 
    bla bla bla 

    </div> 
    </div> 

CSS：

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9997; overflow:hidden; box-shadow: 0px 0px 5px #000000;} 
#cboxOverlay{position:fixed; width:100%; height:100%;} 
#cboxMiddleLeft, #cboxBottomLeft{clear:left;} 
#cboxContent{position:relative;} 
#cboxLoadedContent{overflow:auto;} 
#cboxTitle{margin:0;} 
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;} 
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} 
.cboxPhoto{float:left; margin:auto; border:0; display:block;} 
.cboxIframe{width:100%; height:100%; display:block; border:0;} 

---

.facebooklike { 
    background-image: url(images/likebackground.png); 
    width: 230px; 
    overflow:hidden; 
    height: 70px; 
    -moz-border-radius: 3px; 
    border-radius: 3px; 
    z-index: 9999; 

どうもありがとうみんな:)））

Answer 1

div要素の位置のデフォルト値は 'static'です。あなたのCSSでこの値を相対的なものや絶対的なものに変更しない限り、z-indexは適用されません。

.facebooklike { 
    background-image: url(images/likebackground.png); 
    width: 230px; 
    overflow:hidden; 
    height: 70px; 
    -moz-border-radius: 3px; 
    border-radius: 3px; 
    position: relative; 
    z-index: 9999; 
}