# Stílus fül: Elrendezés és Térközök (V4)

> Az atomikus elemek Megjelenítés beállítása (Blokk, Flex, Rács, Nincs) és a margó és a padding megadása.

Ez a fejezet az atomikus (V4) szerkesztő elemeire vonatkozik. A klasszikus (V3) szerkesztő megfelelője a **Haladó** fül.

Az elemek elrendezését és térközét a **Stílus** fül **Elrendezés** és **Térközök** szakasza adja.

![Az atomikus Div-blokk Stílus füle: az Elrendezés és a Térközök szakasz](./kepek/kontenerek-atomic-stilus.webp)

*Az atomikus Div-blokk Stílus füle: az Elrendezés és a Térközök szakasz* (https://minta-bolt.hu/wp-admin/post.php?post=22&action=elementor)

A képen a **Megjelenítés** mező látszik a **Blokk**, **Flex**, **Rács** és **Nincs** gombokkal, alatta a **Margó** és a **Padding** mezői.

## Elrendezés

A **Megjelenítés** mezővel dől el, hogyan jelenik meg az elem. A gombok: **Blokk**, **Flex**, **Rács** és **Nincs**. A sor végén lévő nyíl két további módot nyit: **Sorközi blokk** és **Sorközi flexkonténer**.

![A Megjelenítés mező nyíllal megnyitott további módjai](./kepek/kontenerek-atomic-megjelenites.webp)

*A Megjelenítés mező nyíllal megnyitott további módjai* (https://minta-bolt.hu/wp-admin/post.php?post=22&action=elementor)

### Blokk

A blokk elem a teljes elérhető szélességet kitölti, de a méretét a **Méret** szakaszban továbbra is szabályozhatod.

### Flex

A flex elrendezés a legösszetettebb, többnyire a Div-blokk és hasonló elrendezési elemek használják (lásd [Div-blokk és Flexbox elem](https://hub.hellowp.io/hu/plugins/elementor/kontenerek-div-blokk-es-flexbox-elem/)). Ha a **Flex** értéket választod, további mezők jelennek meg:

| Beállítás | Mit csinál |
|---|---|
| Irány | A benne lévő (gyermek) elemek sorrendje: balról jobbra, jobbról balra, fentről lefelé vagy lentről felfelé (négy nyíl gomb). |
| Tartalom igazítása | A tartalom elosztása az elemen belül: kezdet, közép, vég, térköz az elemek között, egyenletes térköz az elemek körül, egyenletes térköz. A térközös értékek ugyanazt jelentik, mint a konténernél. |
| Elemek igazítása | A tartalom igazítása a másik tengelyen, az iránytól függően: kezdet, közép, vég vagy nyújtás (az elemek kitöltik a magasságot vagy a szélességet). |
| Hézagok | A gyermek elemek közötti térköz. Külön adhatod meg az **Oszlop** és a **Sor** értékét, a lánc ikonnal pedig összekapcsolhatod őket. |
| Tördelés | Ha a gyermek elemek nem férnek el a szülő elemben, eldöntheted, mi történjen. **Nincs tördelés**: a felesleges elemek kilógnak. **Tördelés**: az elemek a következő sorba vagy oszlopba törnek. **Fordított tördelés**: a tördelés ugyanígy működik, de az első elem lesz az utolsó. |

### Rács

A rácsos megjelenítés beállításait a [CSS Grid az atomikus szerkesztőben](https://hub.hellowp.io/hu/plugins/elementor/szerkeszto-atomic-racs/) fejezet írja le.

### Sorközi blokk és sorközi flexkonténer

Ezekkel tartalmat adhatsz az oldalhoz anélkül, hogy új blokkot kezdenél, miközben az elem megtartja a saját magasságát és szélességét. Ez csökkentheti az oldalon használt div-ek számát, ami javíthatja a teljesítményt.

### Nincs

Főleg reszponzív szerkesztéshez való. A **Nincs** értéknél az elem elrejtődik, ha az adott képernyőméret van kiválasztva. Például ha egy címsor asztali gépen és táblagépen látszódjon, de mobilon ne, hozd létre a címsort, kapcsolj mobil szerkesztésre, és válaszd a **Nincs** értéket. Részletek: [Elemek megjelenítése vagy elrejtése eszközönként](https://hub.hellowp.io/hu/plugins/elementor/kontenerek-elrejtes-eszkozonkent/).

## Térközök

A **Térközök** szakaszban az elem paddingját és margóját állítod be. A padding az elem szegélye és tartalma közötti hely, a margó az elemek közötti hely. Részletek: [Térköz létrehozása margóval és paddinggel](https://hub.hellowp.io/hu/plugins/elementor/kontenerek-terkoz-margo-padding/).

1. Kattints a **Stílus** fülre, és nyisd meg a **Térközök** szakaszt.
2. Két vezérlőcsoportot látsz, egyet a **Margónak**, egyet a **Paddingnak**. Mindkettőben van:
   - egy lánc ikon: ha be van kapcsolva, az alatta lévő négy érték egyenlő,
   - négy mező: **Fent**, **Jobb**, **Lent**, **Bal**, mindegyik mellett mértékegység-választóval (PX).
3. Ha nem akarod, hogy az értékek egyenlők legyenek, kattints a lánc ikonra.
4. Írd be az értékeket a mezőkbe.

A mezők felirata fizikai irányt jelöl (jobb, bal, fent, lent), de a beállítás valójában logikai tulajdonságokat használ, vagyis az írásirányhoz igazodik.