HTML - 居中固定元素并提供父元素的宽度

Question

我想将固定div放在其父级中心。固定div的宽度应该是其父级的宽度。但它不起作用，出了什么问题？

js fiddle

HTML

<div class="container">
 <div class="wrap">
    <div class="center" >
            centered      
    </div>
 </div>
</div>

CSS

.container {
position: relative;
width: 300px;
height: 400px;
border:solid;
margin-right: auto;
margin-left: auto;
padding-left: 15px;
padding-right: 15px;
}

.wrap {
height: 800px;
width: 100%;
position: relative;
text-align: center;
}

.center{
background: red;
position:  fixed;
bottom: 100px;
width: inherit;  
}

Answer 1

更改.wrap的宽度：

.wrap {
    height: 800px;
    width: inherit;
    position: relative;
    text-align: center;
}