# Marginesy zewnętrzne i wewnętrzne

Uwaga: nie wszystkie elementy stylów są akceptowane przez przeglądarki, w których rozpoczęto implementację stylów.

- Górny margines (top margin)
- Prawy margines (right margin)
- Dolny margines (bottom margin)
- Lewy margines (left margin)
- Mieszane atrybuty marginesu (margin)
- Górny wewnętrzny margines (top padding)
- Dolny wewnętrzny margines (bottom padding)
- Prawy wewnętrzny margines (right padding)
- Lewy wewnętrzny margines (left padding)
- Mieszane atrybuty wewnętrznego marginesu (padding)

### Górny margines

Polecenie margin-top: xxx pozwala wprowadzić górny margines dla danego elementu, a więc dodatkowy odstęp między nim a poprzedzającym go elementem.

<p style="margin-top: 2cm">To jest treść akapitu</p>

To jest pierwszy akapit.

To jest drugi akapit, w którym górny margines ma 2 cm.

### Prawy margines

Polecenie margin-right: xxx pozwala wprowadzić prawy margines dla danego elementu, a więc dodatkowy odstęp między nim a prawym brzegiem strony czy następującym po nim elementem.

<p style="margin-right: 2cm">To jest treść akapitu</p>

To jest drugi akapit, w którym prawy margines ma 2 cm. To jest drugi akapit, w którym prawy margines ma 2 cm. To jest drugi akapit, w którym prawy margines ma 2 cm. To jest drugi akapit, w którym prawy margines ma 2 cm. To jest drugi akapit, w którym prawy margines ma 2 cm. To jest drugi akapit, w którym prawy margines ma 2 cm. To jest drugi akapit, w którym prawy margines ma 2 cm.

### Dolny margines

Polecenie margin-bottom: xxx pozwala wprowadzić dolny margines dla danego elementu, a więc dodatkowy odstęp między nim a następującym po nim elementem.

<p style="margin-bottom: 2cm">To jest treść akapitu</p>

To jest pierwszy akapit, w którym dolny margines ma 2 cm.

To jest drugi akapit.

### Lewy margines

Polecenie margin-left: xxx pozwala wprowadzić lewy margines dla danego elementu, a więc dodatkowy odstęp między nim a lewym brzegiem strony czy poprzedzającym go elementem.

<p style="margin-left: 10%">To jest treść akapitu</p>

To jest akapit, w którym lewy margines ma 10 procent.

### Mieszane atrybuty marginesu

Możemy podawać mieszane wartości marginesów dla danego elementu, poslugując się poleceniem margin:. Przykładowo:

p style="margin: 1cm" wprowadzi 1-centymetrowy margines ze wszystkich stron.

p style="margin: 1cm 2cm" wprowadzi 1-centymetrowy margines u góry i u dołu oraz 2-centymetrowy margines z lewej i z prawej strony.

p style="margin: 1cm 2cm 0.5cm 1.5cm" wprowadzi odrębne marginesy dla każdej ze stron.

### Górny wewnętrzny margines

Różne elementy możemy oddzielać od innych, definiując dodatkowy wewnętrzny margines, poszerzający "naturalny" odstęp.

<p style="padding-top: 1cm">Akapit oddzielony od od innego elementu dodatkowym, 1-centymetrowym odstępem.</p>

Akapit oddzielony od górnego brzegu obramowania 1-centymetrowym odstępem.

Akapit oddzielony od górnego brzegu komórki tabeli 5-milimetrowym odstępem.

Akapit oddzielony od obrazka dodatkowym, 1-centymetrowym odstępem.

### Dolny wewnętrzny margines

W analogiczny sposób tworzymy dolny wewnętrzny margines.

<p style="padding-bottom: 1cm">Akapit oddzielony od od innego elementu dodatkowym, 1-centymetrowym odstępem.</p>

Akapit oddzielony od dolnego brzegu obramowania 1-centymetrowym odstępem.

### Lewy wewnętrzny margines

<p style="padding-left: 1cm">Akapit oddzielony od od innego elementu dodatkowym, 1-centymetrowym odstępem.</p>

Akapit oddzielony od lewego brzegu obramowania 1-centymetrowym odstępem.

### Prawy wewnętrzny margines

<p style="padding-right: 1cm">Akapit oddzielony od od innego elementu dodatkowym, 1-centymetrowym odstępem.</p>

Akapit oddzielony od prawego brzegu obramowania 1-centymetrowym odstępem. Akapit oddzielony od prawego brzegu obramowania 1-centymetrowym odstępem.

### Mieszane atrybuty wewnętrznego marginesu

Możemy ustalić kilka atrybutów padding jednocześnie. Na przykład:

<p style="padding: 1cm">Akapit oddzielony od obramowania dodatkowymi odstępami.</p>

Akapit oddzielony od obramowania dodatkowymi odstępami

Możemy także podać odrębne wartości dla kolejnych marginesów, np. 1cm 2cm - górny/dolny prawy/lewy (realizowane z błędami).