CHAPTER 8 ■ POSITIONING: INDENTED, OFFSET, AND ALIGNED
Indented
HTML
<h1>Indented</h1>
<div class="gp">Positioned Grandparent
<div class="parent">Non-positioned Parent
<div id="hss" class="s">Horizontally Stretched Static</div>
<div id="vsa" class="s">Vertically Stretched Absolute</div>
<span id="hsa" class="s">Horizontally Stretched Absolute</span>
</div>
</div>CSS
.gp { position:relative; z-index:10; }#hss { position:static;
width:auto; margin-left:30px; margin-right:30px;
height:auto; margin-top:auto; margin-bottom:20px; }#vsa { position:absolute;
width:120px; left:auto; margin-left:auto; right:0; margin-right:70px;
height:auto; top:0; margin-top:-30px; bottom:0; margin-bottom:-30px; }#hsa { position:absolute;
width:auto; left:0; margin-left:-30px; right:0; margin-right:-30px;
height:auto; top:auto; margin-top:30px; bottom:auto; margin-bottom:auto; }/* Nonessential rules are not shown. */