<body>
<div>
<h1>Parent Element</h1>
<h2>position: fixed;</h2>
<div class="child">
<h1>Child Element</h1>
<h2>position: absolute;</h2>
<h2>top: 20px;</h2>
<h2>right: 20px;</h2>
</div>
</div>
</body>
body {
background: linear-gradient(purple, blue) no-repeat;
height: 1000px;
}
div {
position: fixed;
width: 600px;
height: 300px;
padding: 10px;
background-color: sandybrown;
}
.child {
position: absolute;
top: 20px;
right: 20px;
width: 300px;
height: 300px;
background-color: cadetblue;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.