Static Positioning
- DEFAULT positioning style for HTML
- Normal "Block" element flow
- Follows the "Normal" page flow
- Top to Bottom, Left to Right
- Positioning attributes such as Left, Right, Top, and Bottom have no effect
- Static Positioning is implied if a "position" is not specified
- Elements are laid out in HTML order
- Display Type
- Margins
- Padding
- Border controls
- Static positioning is the "baseline" for all other positioning types
When to use
- Normal document flow shouldn't be disrupted
- No need for layering or moving elements from the normal flow
- Creating a basic webpage layout, where the default flow is maintained
Important Rules
- Static positioning is default so there is no need to declare
- Use other positioning for moving elements from the natural flow
- The normal flow is useful for responsive design with natural "stacking"
Summary
- Static positioning is the "standard" HTML/CSS layout
- It follows the source code order, and is the starting point for CSS positioning
- Follows the normal document flow, of top to bottom
- It is affected by "Box Model" , not "Offset Properties
- Use for straightforward, natural order layouts without complex positioning
Back to Top