day2-设置position:fixed/absolute无法使用margin:auto调整居中

问题描述：父元素给定宽度，子元素给定宽度，设置子元素position为absolute/fixed后，无法使用margin:auto使子元素在父元素中水平居中

html代码如下：

    <div class="test">
        <div class="m-fixed">
        </div>
    </div>

css代码：

.test{
    height: 200px;
    font-size: 14px;
    width: 100%;
    background-color: #D8BFD8
    }
    .m-fixed{
        position: fixed;
        top: 0;
        width: 80%;
        background-color:    #00FF00;
        height: 200px;
        margin: auto;
        }

效果图：

 

 解决办法：

在子元素设置：left:0;right:0

如果像我一样宽度用的是百分比的话可以直接设置子元素：left:(1-子元素占父元素宽度百分比)/2，我这里是：left:10%

实现效果：

 

 问题导致原因和解决办法实现原理个人还不是很明白，后面搞清楚了以后补上。