The images below are positioned using relative positioning of the span tag which encompasses the image.
The image on the right is displaced 30 pixels to the right. Images which appear later in the HTML will
have a higher z-index than those appearing earlier. Images with a higher z-index are placed in front of
those with a lower z-index. Which object is in front matters when the objects overlap. This technique
seems to work fine in IE and Netscape 4.7 but not work in Netscape 6.2
To get the first image in front of the second requires specifying the z-index of the images.
Absolute positioning of an element normally positions the element relative to the upper left hand corner
of the parent. If the element is not contained within another element, this means the positioning is
relative to the upper left hand corner of the window. By enclosing an element with a div tag, one can
position the element relative to the div tag. For example, if we put a div tag right after the
end of the paragraph, we can position an item absolutely relative to this position. Here the word Yahoo,
which would otherwise be part of the sentence "Yahoo is an internet portal", is moved, and the remaining text
takes it place.
Yahoo is positioned 20 pixels down and to the right of this div tag.
One of the most-visited sites on the Internet is
Yahoo, which is an internet portal
Heading 2
If the preceding heading is not green, then the style sheet properties aren't working in after this use
of absolute positioning of a child relative to its parent. Thus there seems to be a problem with using this
technique in Netscape 4.7 without disabling subsequent CSS features. However, it works in Netscape 6.2
and IE.