What if you change the position property from absolute to relative? Take a
look at this:
<style>
.absol {position: relative; top: 0px; left: 0px;}
</style>
Changing the position value from absolute to relative causes default behav-
ior. The graphic is positioned where it would normally flow — in the stacking
order of the elements based on their order in the HTML code, as shown in
Figure 4-5:
Elements with a fixed value for the position property remain in their location
in the browser, even if the user scrolls the browser. The other elements that
are not fixed scroll, but the fixed element does not. This trick can be used to
make a running headline, to frame, or to preserve a header or a set of labels
at the top of a table. However, using fixed has two drawbacks. It can look
annoying when the user scrolls — the item can jitter and bounce as it resists
scrolling — and, more importantly, this technique doesn’t work in IE. If some-
thing doesn’t work in 96 percent of the browsers in use today, what’s the
point? Just avoid it.
Figure 4-5:
Change
absolute to
relative and
the default
flow order
of the
elements —
with the
graphic at
the bottom
— is
restored.