CSS & Styling

Hoe werken position, top, bottom, left, right?

Position bepaalt hoe elementen zich positioneren relatief tot hun omgeving.

Home/Categorieën/CSS & Styling/Hoe werken position, top, bottom, left, right?

Position types

static (standaard): normale documentflow relative: relatief tot normale positie absolute: relatief tot positioned parent fixed: relatief tot viewport (blijft bij scrollen) sticky: hybride van relative en fixed

top, bottom, left, right

Deze properties werken ALLEEN als position NOT static is. Ze bepalen offset van normaal.

Code Voorbeelden

CSSAlle position types✏️ Interactief
✏️CODE AANPASSEN
LIVE PREVIEW

💡 Praktijk Tips

z-index alleen werkt op positioned elements (niet static). Misbruik absolute positioning niet - Flexbox/Grid zijn meestal beter.

Relevante trefwoorden

positionabsolutefixedrelative