使用float,position:absolute div被隱藏

<div id="first">
</div>
<div id="second">
  <div id="child"></div>
</div>

#first {
    width: 200px;
    height: 200px;
    background-color: green;
    float:left;
    z-index:1
}

#child {
    width: 50px;
    height: 50px;
    background-color: red;
    position: absolute;
    left: -25px;
    top: 100px;
}

#second{
  float:left;
  width:100px;
  height:200px;
  background-color:yellow;
  position:relative;
  overflow-y: scroll;
  z-index:100
}

我需要將first,second左右布局，所以使用了float;
我需要兌child位置進(jìn)行定位，所以使用了Postition:absolute;
這些都沒(méi)有問(wèn)題，但是：
如果父div使用overflow:hidden/overflow的話，會(huì)導(dǎo)致child一半被遮住。
像這樣：

如果我把overflow-y去掉，或者屬性改成visible,就變成了我想要的

但是問(wèn)題是：overflow-y:scroll是必須的。請(qǐng)問(wèn)如何解決？