Bloky
Blokový model CSS popisuje, jakým způsobem chápe prohlížeč blokové prvky a jaké vlastnosti jim umí přiřadit. Jak jsem si již uvedli, elementy se řadí na blokové a řádkové. Základní rozdíl je v tom, že řádkové elemety ovlivňují pouze svůj obsah, kdežto blokové elementy mohou ovlivnit i další elementy ve svém okolí, tedy ne jen potomky.
Každému blokovému prvku je možné přiřadit vlastnosti width (šířka) a height (výška). Tyto vlastnosti se uvádí v některé z délkových jednotek (absolutní, relativní, či procentuální). Tím je určen základní rozměr blokového prvku. Není-li hodnota uvedena, nabývá šířka hodnoty 100% nadřazeného prvku. Výška se pak odvozuje od vlastího obsahu.
K takto definovanému základnímu rozměru se pak přidává ještě šířka rámečku (ne všechny prohlížeče to k tomu připočítávají) vnitřní okraj prvku a vnější okraj prvku.
Řámeček je definován sdruženou vlastností border, případně specifickými vlastnostmi pro každou hranu. Prostor mezi rámečkema obsahem se dá upravit vlastností padding (vnitřní okraj) a odstup od okolních objektů nastavuje vlastnost margin (vnější okraj bloku).
Celková šířka (výška), kterou objekt zabírá, tedy zahrnuje součet vlastní šířky obsahu, vnitřního okraje, síly rámečku a vnějšího okraje. To vše navíc může být různé pro všechny čtyři hrany.