Floats - Notes

[arslan_baby]

SYNTAX: float: [VALUE];

1. "float" tells
- Item A to align to the left of its container.
- Items around item A to flow around (instead of under) it.

2. Most common values: left; right; none.

3. If item A is a float item & item B is a normal item, item A will be inside item B. If both items A & B are float items, item A will be next to item B. OR: Float items stack next to, instead of atop, each other.

4. Float items' heights do not get recognized. Thus, to tell items not to flow around a float item:
4.1. Add to item C next to item A&B:

SYNTAX: clear: [VALUE];

- Values: left; right; both.
- Tells item C to ignore the command to "flow around the item floated left/right/either" above.
4.2. Add to container item:

SYNTAX: overflow: hidden;

- Tells container item (item containing A & B) to recognize that A&B contributes to its height.
5. If the float item can't fit horizontally, it automatically moves down (vertically).