<div class="outer">
<div class="inner"></div>
</div>
.outer{
background-color:yellow;
position: relative;
width: 100%;
height : 1000px;
}
.inner{
background-color:red;
position: fixed;
left: 50%;
top : 50%;
transform: translate(-50%,-50%);
width: 50%;
height : 10%;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.