如何在一个固定的祖父母中覆盖一个祖父绝对div？

Question

我有3个div。大父母（固定），父母（亲属）和孩子（绝对）......

我希望孩子覆盖祖母。

这是我的代码：

＆＃13;

＆＃13;

.grand-parent {
  width: 500px;
  height: auto;
  overflow: auto;
  position: fixed;
  top: 20px;
  left: calc(50% - 250px);
  background-color: #EEE;
}

.parent {
  width: 300px;
  height: 50px;
  position: relative;
  margin: 10px;
  background-color: #DDD;
}

.child {
  position: absolute;
  width: 200px;
  height: 400px;
  background-color: #CCC;
}

＆＃13;

<div class="grand-parent">
  <div class="parent">
    <div class="child"></div>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

如何在父级和父级div之外显示子元素？