先看代码：
// html
<div class='a'>
<div class="b">
<div class="c"></div>
</div>
</div>
// css
.a {
height: 200px;
width: 300px;
border: 1px solid #ccc;
overflow: hidden;
}
.b {
position: relative;
}
.c {
width: 100px;
height: 400px;
background: red;
position: absolute;
}
1.png
c 元素 的高度比 a 元素的高度高，c 元素 的定位也是绝对定位，可以看出红色的块 c 元素 超出 a 元素的部分被隐藏了。
而我想要的是超出部分可以继续显示。
我们都知道具有绝对定位的元素 是相对于其具有定位的父节点offsetParent（relative， absolute， fixed） 进行定位的，当没有定位的父级节点。
而上面的代码中 c 元素 相对于具有相对定位的父元素 b 元素 进行定位的，b 元素 是相对定位，所以没有脱离文档流，依然还在 a 元素 里占据位置，猜想这就是为啥被隐藏的原因。
.b{
// position: relative;
}
2.png
当把 b 元素的相对定位去掉后, 超出部分就可以不被隐藏了， 因为此时 c 元素是相对body 来定位的。
或者
.b{
position: absolute;
}
给 b 元素换成绝对定位absolute，一样也可以实现，这样 c 元素相对 b 元素定位， 而 b 元素脱离了文档流 相对于 body 定位， 就不受 a 元素的影响了。
3.png
完。
