CSS Výplň



Výplň (anglicky padding) sa zadáva totožne ako margin, avšak margin je medzi borderom a druhým elementom a padding je medzi borderom a samotným elementom.


padding: 30px; border: 1px solid black; float: left ;






Takto sa nastaví, že medzi elementom a borderom bude medzera 30 pixelov. Tak ako margin tiež sa dá nastaviť pre všetky strany zvlášť.


padding-left: 30px; border: 1px solid black; float: left ;



Taktiež aj pre všetky strany naraz.


padding: 10px 20px 30px 40px; border: 1px solid black; float: left ;







!Pozor1! Ak udávamte šírku nejakého elementu tak si musíte dať pozor, že do celkovej, resp. konečnej, šírky musíte započítať aj padding, margin alebo border, ktorý pridáte.




!Pozor2! Po vyskúšaní ste si mohli všimnúť, že hranica elementu vám vždy pokračovala až na koniec stránky, aj keď tam váš element už nepokračoval. Tomu sa dá zabrániť použitím vlastnosti float: left; ktorá danému elementu/-om povie, aby sa zoradili čo najviac zasebou na ľavú alebo pravú (v tomto použijeme iba namiesto left right) stranu a teda nedovolí paddingu elementu pokračovať až do konca stránky.