➜ LAYOUT POSITIONS CONCEPT:
It is possible to position elements on a relative, floated, absolute or fixed basis. For everything else follow the original concept and the various types of grids.
It is possible to position elements on a relative, floated, absolute or fixed basis. For everything else follow the original concept and the various types of grids.
❯❯ Floatting elements
make a float-group and put a float element. The floats class forced layout to unwide.
DIV float on left
DIV float on left
DIV float on right
SPAN on left
SPAN on left
SPAN on right
❯❯ Absolute positions
Absolute class put element relative of parent. The logic is really simple to understand: "POSITION-SWITCH-SWITCH" => "absolute-top-left"
Absolute class required a container and it's good idea to make it width a real height
absolute
absolute
absolute
absolute
absolute
absolute
absolute
absolute
absolute
❯❯ Fixed positions
Equal to Absolute (same logic: "POSITION-FRIST-SWITCH" => "fixed-top-left") but, in fixed position, elements flyout of box -obviously- and wrap or fisical height it's not necessary.
TEST IT
❯❯ Sticky positions
Similar to Absolute and fixed but, in sticky, the logic is simplfied: Have a left,right,top,bottom... no other.
In add to this all position of the elements flyout of box relative of their wrap and scroll height.
TEST IT FOR : TOP / BOTTOM
TEST IT FOR : LEFT / RIGHT