CSS box model

HTML elementi kao što su naprimer <p>, <div>, <span>, <table>, <td>, <tr> i drugi, definišu sadržaj i strukturu, ali što je najvažnije za našu priču PRAVE PROSTOR kako bi se smestio taj sadržaj. Taj prostor shvatimo kao jednu kutiju (box - boks) koju CSS može dekorisati. Taj BOX možemo pretstaviti i slikovno:

Kao što vidimo sa slike taj box prostor se deli na 4 dela:

CONTENT - sadržaj elementa koji je na našoj slici samo veliko slovo A;
PADDING - praznina izmedju sadržaja i linije granice elementa;
BORDER - linija granice elementa;
MARGIN - prazan prostor izmedju granice elementa i okolnih elemenata;

Svi ovi nabrojani delovi prostora u CSS - u se opisuju većim brojem atributa, a atributi većim brojem vrednosti da bi se što lepše i preciznije dekorisale internet strane.

Postoje atributi box modela koji definišu njegovu visinu i širinu kao što su:

with - definiše širinu elementa,
hight - koji definiše visinu elementa.

U nastavku će mo objasniti sve atribute box elemenata kao i njihove vrednosti.