Okraj

Uvnitř karty jsou jméno, věk, popis i tlačítko natěsno pod sebou. Místo mezi prvky vytváří okraj (margin): volné místo vně rámečku. Jeho třídy fungují stejně jako třídy polstrování, jen začínají písmenem m místo p:

Jeden zvyk vám ušetří starosti: mezi prvky pod sebou dělejte mezeru jen z jedné strany, třeba vždy horním okrajem (mt-*). Pak nikdy nemusíte řešit, co se stane, když se dva okraje potkají. (Jak víte z kurzu CSS, svislé okraje sousedních prvků se slučují a mezera je jen tak velká jako větší z nich.)

Jméno a věk v kartě k sobě patří, takže zůstanou blízko. Popis dostane víc místa a tlačítko nejvíc, aby se od textu oddělilo.

Preflight odstranil i okraj 8 pixelů kolem body, a proto se karta dotýká krajů náhledu. Stránce dáme polstrování: místo uvnitř body mezi krajem okna a obsahem.

Tip: Mezery si můžete prohlédnout pomocí volby Prozkoumat, stejně jako v kurzu CSS: klikněte na prvek v náhledu pravým tlačítkem myši, zvolte Prozkoumat a v nástrojích pro vývojáře na prvek najeďte myší. Prohlížeč jeho polstrování a okraj vyznačí různými barvami.