Mit Hilfe der folgenden Befehle werden in CSS die Position von Elementen und deren Rahmen und Ränder definiert. Jedes Element besteht aus der Elementgröße (~ flächenmäßige Ausdehnung) und dem Inhalt (z.B. Text).
Die Elementgröße wird in CSS durch width und height definiert.
Bei width und height kann auch ein minimaler bzw. maximaler Wert definiert werden, so dass man unabhängig von der Schriftgröße, Bildgrößen oder des Inhalts ein Grundlayout definieren kann: min-width, max-width, min-height, max-height.
Mit Hilfe von margin (Abstand eines Elements von einem anderen Element) und padding (Abstand des Inhaltes innerhalb eines Elements von dem Elementrand) kann in CSS die Position eines Elementes festgelegt werden.
Bei padding und margin können die Abstände von dem oberen, rechten, unteren und/oder linken Rand definiert werden. Zusätzlich können die Abstände nach oben, rechts, unten und links über das direkte Ansprechen der Position definiert werden:
padding/margin-top,
padding/margin-right,
padding/margin-bottom,
padding/margin-left
Hierbei sind sowohl positive als auch negative Werte möglich.
Die Werte können auch nur für einzelne Abstände definiert werden, z.B.:
Mit Hilfe von position: xxx wird in CSS festgelegt, was den Ausgangspunkt für die Positionierung eines Elements darstellt.
Bei den Positionswerten relative, absolute und fixed kann die Position eines Elements verändert werden.
Dies erfolgt durch top, right, bottom, left: | <prozentwert> | static-position | auto |, wobei sich die Prozentangaben auf bei left und right auf die Breite, bei bottom und top auf die Höhe des Elternelements beziehen. Mit Hilfe von static position behält das Element die Position, an der das übergeordnete Element ist.