html - 如何使用 z-index 将 div 推到后面？

Question

我怎样才能将 .left-corner 稍微推到后面而不破坏文本的开始位置。

jsFiddle：http: //jsfiddle.net/gnjNq/

<div class="quick-links-container">
    <div class="left-corner"></div>
    QUICK LINKS
</div>

.quick-links-container{
    z-index: 8000;
    right: 20px;
    background-color: white;
    height: 500px;
    width: 200px;
    position: absolute;
    box-shadow:0px 4px 6px rgba(0,0,0,.2);
}

.left-corner{
    height: 25px;
    width: 25px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    background-color: white;
    box-shadow:0px 4px 6px rgba(0,0,0,.2);
    z-index: 7900;
    position: relative;
    left:-10px;
    top: 20px;
}

这就是我想要实现的目标：

Answer 1

删除z-indexfor.quick-links-container并给出.left-corner否定z-index。

http://jsfiddle.net/gnjNq/4/

Answer 2

http://jsfiddle.net/gnjNq/3/ Z-index需要为负值才能z-index在容器上删除并删除。