CODEWITHSUNDEEP
htmlcss
user2952265
user2952265

Reputation: 1630

HTML - center fixed element and provide width of the parent

I want to center a fixed div inside its parent. The width of the fixed div should have the width of its parent. But it does not work, what is wrong?

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;  
}

Upvotes: 0

Views: 785

Answers (1)

kkontagion
kkontagion

Reputation: 516

change .wrap's width:

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

Upvotes: 3

Related Questions