div嵌套水平居中问题

问题背景：div的style设置了margin：0px auto ，但却不生效
问题解决：
1. 父级div设置宽度，
2. 父级div设置position:absolute
3. 父级div设置display:inline-block
4. 当前div设置宽度，
5. 当前div 不能 设置position：absolute
6. 当前div 不能 设置display:inline-block

代码参考：

<!--父级div-->
<div style="width: 200px;height: 200px;position: absolute;display: inline-block;background-color: red;left:100px">
    <!--当前要做居中的div-->
    <div style="width: 40px;height: 40px;margin:0px auto;background-color: yellow;"></div>
    <span>水平居中</span>
</div>
<br/>

<!--父级div-->
<div style="width: 200px;height: 200px;position:absolute;display: inline-block;background-color: red;top:300px;left:100px">
    <!--当前要做居中的div-->
    <div style="position:absolute;top:0;bottom:0;margin:auto 0px;width: 40px;height: 40px;background-color: yellow;"></div>
    <span>垂直居中</span>
</div>


<!--父级div-->
<div style="width: 200px;height: 200px;position:absolute;display: inline-block;background-color: red;top:600px;left:100px">
    <!--当前要做居中的div-->
    <div style="position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;width: 40px;height: 40px;background-color: yellow;"></div>
    <span>水平垂直都居中</span>
</div>


<div style="width: 200px;height: 200px;position:absolute;display: inline-block;background-color: red;top:900px;left:100px">
    <div style="position:absolute;left:0;right:0;margin:0px auto;width: 40px;height: 40px;background-color: yellow;"></div>
    <span>水平居中2</span>
</div>