Margin en padding
Er schijnen nogal wat onduidelijkheden te bestaan over het onderscheid tussen marging en padding in CSS. Toch is het helemaal niet zo complex. Het verschill tussen beide kan op eenvoudige wijze duidelijk gemaakt worden aan de hand van twee afbeeldingen. Stel je voor je hebt een webpagina waarbinnen zich een vierkant bevindt met daarin tekst.
De ruimte tussen de de rand van de webpagina en de vierkant (element) is de ruimte waar de margin plaatsvindt.
Dus de ruimte buiten het element (de vierkant)
De ruimte tussen de tekst (dat kan natuurlijk ook iets anders zijn dan tekst zoals bijvoorbeeld een afbeelding) en de vierkant (element) is de ruimte waar de padding plaatsvindt.
Dus de ruimte binnen de rand van het element (de vierkant) en diens inhoud (in dit geval de tekst “Welkom op onze website!”)
Hopelijk is het verschil tussen margin en padding iets duidelijker geworden 😀 .
