Box-Modell in CSS
Das CSS Box-Modell beschreibt die horizontalen Boxen, die für Elemente generiert werden. Diese Boxen lassen sich per CSS-Deklarationen ansprechen und kontrollieren. Folgende Zeichnung verdeutlicht das Modell:
top MT = margin-top +================================+ BT = border-top | MT margin | PT = padding-top | +~~~~~~~~~~~~~~~~~~~~~~~~~~+ | PB = padding-bottom | | BT border | | BB = border-bottom | | +--------------------+ | | MB = margin-bottom | | | PT padding | | | ML = margin-left | | | +..............+ | | | BL = border-left left|ML|BL|PL| content |PR|BR|MR|right PL = padding-left | | | +..............+ | | | PR = padding-right | | | PB | | | BR = border-right | | +--------------------+ | | MR = marginright | | BB | | | +~~~~~~~~~~~~~~~~~~~~~~~~~~+ | = margin-Rand | MB | ~ border-Rand +================================+ - padding-Rand bottom . content-Rand
Weitere Erläuterungen sind in der CSS2-Spezifikation im Kapitel 8 Box Model zu finden.
Michael Jendryschik · http://jendryschik.deDominik Boecker · dominik.boecker@gmx.de