* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body { padding: 1em; } .parent { width: 49%; float: right; height: 10em; background: deepskyblue; padding: 1em; font-family: Helvetica, Arial, sans-serif; } .parent.position { float: left; } .position { position: relative; } .child { position: absolute; top: 0; right: 0; width: 1em; height: 1em; padding: .25em; background: tomato; text-align: center; font-size: 2em; line-height: .5em; color: black; text-decoration: none; }
<div class="parent position"> <strong>Relative</strong> parent <a href="#" class="child">×</a> </div> <div class="parent"> <strong>Static</strong> parent <a href="#" class="child">×</a> </div>