Smiley face- position set within the IMG tag using STYLE
Sad smiley - position set with CLASS in the P tag
Winky smiley position set with CLASS in the DIV tag
Open Mouth smiley position set inline in H2 tag
Glasses smiley position set within the LAYER tag.
Open Eyed smiley position set with CLASS in LAYER tag
Tongue Out smiley position set with CLASS in BLOCKQUOTE tag.
Though text wraps when window size or resolution is changed, the items with absolute position don't move. This may cause undesirable overlaps vertically and may place items out of view horizontally.
In addition there is the question of browser differences. For example, this page under NC4 at 800 x 600 puts all but 2 smileys in a row beside the heading Absolute Examples. But at 640 x 480 the smileys are much higher on the page. On the other hand, under IE4 only 2 smileys are beside the heading while the others string down the page on the left, one per line. If other items further down the page had absolute position, they would wind up in VERY different positions with respect to the wrapping text under IE4 than under NC4!
Note:
Under NC4, CLASS applied to LAYER appears to act as a relative position instead of absolute. (See the position of the Open Eyed smiley under NC4.) LAYER successfully takes settings directly in the tag for TOP and LEFT for absolute placement.
Netscape 6 leaves only the smiley with glasses in relative position. But the
line of smileys is not straight. Very odd effect.
IE4 apparently supports absolute position only for P and DIV. But, IE6 positions all the smileys absolutely except the two using LAYERS, which is a Netscape creation anyway.
