absolute 与overflow:hidden常见bug

我们使用第三方的组件时，第三方组件有时会依据我们引入组件的DOM的位置进行定位，很常见的CSS写法就是使用position：relative和position:absolute进行搭配使用，有时在父容器的外层添加了overflow:hidden之后，就会出现一些莫名奇妙的bug.下面举个例子

你可以访问如下页面：https://alizwell.github.io/front-end/CSS/absolute&overflowHidden.html

你可以看到因为overflow：hidden的影响，我们自己定义的tooltips超出容器的部分将会被完全截断，而解决的办法目前来看有两种，一种是你将父容器的overflow：hidden属性给去除掉，另外一种方法是给组件定位依赖的那个position：relative属性的容器再套一个容器，同时设置属性position: absolute. 其本质是，将position：relative的容器包裹在position：absolute的容器中，使其逃离overflow：hidden的影响。、

这里有一点需要说一下，那就是当容器设置position:absolute时，如果不给他设置top,left,right,bottom时，容器的位置是会保留在其在正常文档流中的位置，但是其将不会影响文档流中其他正常元素的位置。这个叫做所谓的位置跟随性，利用这个可以做很多有意思的事情。
还有一点就是如果设置了对立的位置属性，如left和right,top和bottom.那么这个时候在结合margin: auto，就可以实现一个很强大的居中定位的方法。

如果想要了解更多关于absolute的知识，请查阅如下链接。
1.https://www.zhangxinxu.com/wordpress/2010/01/absolute绝对定位的非绝对定位用法/
2.https://www.zhangxinxu.com/wordpress/2010/12/css-相对绝对定位系列（一）/
3.https://blog.csdn.net/liufeng520/article/details/26058775