Padding i margines
2009
Margines
Margines określa przestrzeń wokół elementów. Możliwe jest stosowanie wartości negatywnych. Standardy CSS pozwalają na ustawienie marginesu:
- lewego "margin-left"
- prawego "margin-right"
- góry "margin-top"
- dołu "margin-bottom"
W pliku CSS można zdefiniować margines w następujący sposób:
#kod {
margin: 10px 10px 10px 10px;
}
Powyższy kod określa margines, który wynosi 10 pikseli z każdej strony {margin:’margin-top’ ‘margin-right’ ‘margin-bottom’ ‘margin-left’} .
Jeśli chcemy aby margines był taki sam dla każdgo boku możemy użyć następującego kodu:
#kod {
margin: 10px;
}
Padding
Padding również określa przestrzeń wokół elementów. Standardy CSS pozwalają na następujące ustawienia:
- lewy "padding-left"
- prawy "padding-right"
- góra "padding-top"
- dół "padding-bottom"
#kod {
padding:’padding-top’ ‘padding-right’ ‘padding-bottom’ ‘padding-left’;
}
Różnica pomiędzy paddingiem i marginesem
Padding określa przestrzeń wokół danego elementu, np: <p> lub >div>, natomiast margines przestrzeń pomiędzy elementami.
Jak widać na rysunku, padding oznaczony jest kolorem niebieskim. Okresla on wielkość przestrzeni wokół elementu <p>. Element ten posiada również margines zaznaczony kolorem pomarańczowym. Jest to odleglość od brzegu elemenu <body>.