CHAPTER 13. POSITIONING: RELATIVE AND ABSOLUTE 141
Static is never used as a basis for other positioning.
13.2.2 position: relative;
Relative is like static in that it takes up space in the flow.
Relative is different from static in that it can be used as a basis for other
positioning, and it also supports directional adjustments.
Directions are relative to its natural place in the flow.
13.3 Elements Removed From Flow
In two cases, the positioned element is removed from the flow. That is, it
takes up no space between the things that come before and after it, and
it does not inherit its width from its surroundings. Instead, it overlaps or
hides beneath the other content.
Exam Question 260(p.351):List the two CSS positions that remove an
element from the flow.
Required Answer:absolute, fixed
When an element is removed from the flow, the rest of the document flows
as though it were not even there. It takes up no space in the flow. It does
not affect the position of static or relative things.
When an element is removed from the flow, it is usually necessary to spec-
ify a width for the element, since it cannot be logically deduced from its
surroundings. Optionally you can also set a height.
13.3.1 position: absolute;
Exam Question 261(p.351):Which CSS position depends on its closest
positioned ancestor?
Required Answer:absolute
With absolute, the element is removed from the flow. It takes its position
based on the closest ancestor that is not positioned static. Its position will
follow that ancestor as the webpage is scrolled up or down, left or right.
If there is no ancestor that is positioned, it uses body. It is the same as if
you saidbody { position: relative; }in your CSS.