HTML and CSS Reference
In-Depth Information
value of auto , the inner division's top-let corner is in the same place as it was
in Figure 3.19a. But since it is no longer in the document low, its height and
width are now 50 percent of its containing element: the viewport coinciding
with the document's html element. hus, the inner division is half the height
and width of the browser's window and will grow and shrink as the window is
resized. Try it!
Figure 3.19b: A division with absolute positioning and auto offset
Finally, add some ofset to the position of the inner division as shown in
the following CSS statement, save, and reload the example again. Figure 3.19c
shows the result that I saw using Firefox.
#d2 { width: 50%; height: 50%; border: solid;
position: absolute;
top: 0; right: 0; }
Figure 3.19c: An absolutely positioned element offset with respect to the
viewport
Search WWH ::




Custom Search