Chapter 9: Position styles
CSS can be used to fine-tune the placement of an element in the page.
Positioning can be of three types:
1) Absolute: Absolute positioning specifies an absolute position from the top left of the page.
2) Relative: Relative positioning moves an element relative to its natural ordering in the page.
3) Fixed: Fixed positioning keeps the element at the same position during scroll.
Consider the following two divs:
Example of absolute positioning:
Note that the 450px,550px is specified from the top left corner of the webpage.
This can be somewhat risky thing to do because the size of the webpage is
device dependent. So if this page is viewed on a mobile screen, then the layout
will be completely different and absolute positioning may not be correct.
Example of relative positioning:
Fixed positioning is very similar to absolute positioning.
Only difference is that 'fixed' position remains unaffected by scroll.
The distance can be specified from four edges: top, bottom, right, left
|Email:||(Your email is not shared with anybody)|