如何使用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-index的{​​{1}}并将.quick-links-container置为否定.left-corner。

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

Answer 2

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