<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title></title><style type="text/css" title="text/css">* .grandContainer { position: relative; height: 295px; width: 600px; border: 2px solid black; background: red;}* .parent { margin: 10px; padding: 10px; padding-top: 0; border: 1px solid black; background: purple;}* .ex { padding: 5px; border: 5px solid black;}div.ex span { margin-right: -60px; border: 1px dotted black;}span.ex span { margin-right: 30px; border: none; background-color: gold;}#myStyle { position: absolute; top: 0; margin-top: 200px; width: auto; left: auto; margin-left: auto; right: 0; margin-right: -50px; background-color: gold;}</style></head><body><div class="grandContainer">Positioned Grandparent <div class="parent">Non-positioned Parent <span id="myStyle" class="ex"><span>Shrinkwrapped Absolute: -50px</span></span> </div></div> </body></html>
