HOTSPOT
You develop a webpage.
The layout of the webpage must resemble the following image:
You need to ensure that the page renders properly.
How should you complete the relevant CSS styles? (To answer, select the appropriate
option from each drop-down list in the answer area.)
Explanation:
relative behaves the same way as static if no special properties are applied.
absolute behaves like fixed except relative to the nearest positioned ancestor instead of relative to the viewport. If an absolutely-positioned element has no positioned ancestors, it uses the document body, and still moves along with page scrolling. Remember, a “positioned” element is one whose position is anything except static
* position: relative
The element is positioned relative to its normal position, so “left:20” adds 20 pixels to the element’s LEFT
position
* position: absolute
The element is positioned relative to its first positioned (not static) ancestor element
Reference: CSS position PropertyE0