Margines a dopełnienie na stronie internetowej

Warto różnicę między dopełnieniem a marginesem w WordPressie. Dopełnienie to odstęp między treścią a krawędzią bloku, natomiast margines to odstęp między dwoma oddzielnymi blokami. Poniżej pokażemy różnice w praktyce i jak właściwe wykorzystać marginesy oraz dopełnienia.

Dopełnienie – jak z niego korzystać

Funkcja dopełniania w WordPressie w edytorze motywu (ale i page builderach) służy do tworzenia miejsca wewnątrz bloku. Na przykład możemy dodać miejsce wewnątrz bloku tekstu, aby uczynić jego układ bardziej atrakcyjnym wizualnie i zapobiec pojawianiu się tekstu zbyt blisko krawędzi bloku.

Oto przykład edycji dopełnienia nagłówka w edytorze motywu (dla motywów blokowych):

Margines

Margines to przestrzeń wokół granicy bloku WordPress i otaczających go elementów. Może to pomóc w dodaniu przestrzeni między dwoma różnymi blokami, tworząc bardziej przestronny i przejrzysty układ witryny.

Oto przykład edycji marginesu:

Dopełnienie vs margines

Zastosowanie odpowiedniego marginesu i dopełnienia w praktyce pozwala odpowiednio wypozycjonować obiekty na naszej stronie internetowej.

Porównajmy ostatecznie:

Marginesy i dopełnienia możemy także regulować za pomocą odpowiedniego kodu CSS, podstawowy zapis wygląda następująco:

Dopełnienie:

padding-top
padding-right
padding-bottom
padding-left

Margines:

margin-top
margin-right
margin-bottom
margin-left

Przykład:

div {
  padding-top: 50px;
  padding-right: 30px;
  padding-bottom: 50px;
  padding-left: 80px;
}