元素设置overflow:auto后子元素设置position:absolute也会占正常文档流的位置，如何解决？

元素设置overflow:auto后子元素设position:absolute也会占正常文档流的位置，求大神解答是什么原因，如何解决？
<div class="test1" style="width:400px;height:400px;overflow:auto;border:1px solid #ccc;">
    <div style="width:200px;height:300px;position:relative">
      <div class="test3" style="width:300px;height:300px;position:absolute;left:130px;top:0;background:red"></div>
    </div>
  </div>

 

 

 

回答：

因为你中间div设置了position:relative
这样 position:absolute 就会相对于 position:relative 定位
面不是相对于页面左上角定位了。