Okraje a výplně mohou být matoucí, protože v některých ohledech vypadají jako totéž: bílé místo kolem obrázku nebo předmětu. Zde je to, co jako webový designér potřebujete vědět o jejich rozdílech.
Padding
Padding je prostor mezi obrázkem nebo obsahem buňky a jeho vnějším okrajem. Na obrázku níže je výplň žlutá oblast kolem obsahu. V tomto případě výplň prochází celý obsah: horní, spodní, pravou a levou stranu. Můžete určit, kolik odsazení (v procentech, pixelech, bodech atd.) pro každou stranu, a nemusí být stejné. Tímto způsobem můžete umístit obsah v rámci prvku.
Margins
Naproti tomu okraje jsou mezery vně hranice prvku, mezi prvkem a čímkoli, co k němu sousedí. Na obrázku je okraj bílá oblast vně celého objektu. Stejně jako výplň i okraj v tomto příkladu obchází celý obsah: na horní, spodní, pravé a levé straně. Okraje můžete použít k umístění prvků div a dalších prvků na stránce.
Vždy testujte své stránky v různých prohlížečích, operačních systémech (včetně mobilních) a velikostech obrazovky, abyste se ujistili, že se zobrazují přesně tak, jak chcete.
