html - 无法弄清楚 z-index

Question

希望我的倒计时 div 位于 header_top div 下，但我不明白为什么我的 z-index 不起作用。尝试使用 position:relative，但我想我用错了。

有人可以帮忙吗？

索引.php:

        <div class="header_top">
                <div class="links">
                        <div class="link">
                        <img src="img/tweet.png" >
                        </div>
                        <div class="link">
                        <img src="img/face.png" >
                        </div>
                        <div class="link">
                        <img src="img/youtube.png" >
                        </div>
                        <div class="link">
                        <img src="img/streg.png" >
                        </div>
                        <div class="link">
                        <img src="img/faq.png" >
                        </div>
                        <div class="link">
                        <img src="img/message.png" >
                        </div>
                        <div class="link">
                        <img src="img/info.png" >
                        </div>
                </div>


        </div>

    <div class="countdown">
    </div>

样式.css:

.header_top {
    left:0px;
    top:0px;
    position:relative;
    z-index:2;
    width:1024px;
    height:80px;
    background-image:url(../img/top.png);
}
.links {
    position:relative;
    z-index:2;
    float:right;
    margin:10px 0px 0px 0px;
    width:350px;
    height:45px;
}
.link {
    position:relative;
    z-index:2;
    margin:3px 3px;
    display:inline-block;
    vertical-align:top;
}
.countdown {
    position:relative;
    z-index:1;
    left:0px;
    top:0px;
    background-image:url(../img/count.png);
    width:1024px;
    height:160px;
}

Answer 1

尝试将 position: absolute; 添加到 .countdown 选择器。