Reszponzív kialakítás konténerekkel

A konténer a rendelkezésre álló helyet használja ki, ezért a terved kevesebb külön töréspont mellett is jól mutat minden eszközön. Az elemek átméretezése és átrendezése egy szakaszon belül korábban csak sok egyedi CSS-sel vagy külső kiegészítővel ment. A konténerrel ez a szerkesztőben beállítható.

Az eszközönkénti beállításokhoz kapcsolj át a felső sávon a Táblagép vagy a Mobil nézetre. Az eszköz ikonja a beállítás neve mellett jelzi, hogy az érték nézetenként külön adható meg.

https://minta-bolt.hu/wp-admin/post.php?post=18&action=elementor

A képen táblagép nézet látszik: a Szélesség, a Minimális magasság, az Irány, a Tartalom igazítása, az Elemek igazítása, a Hézagok és a Tördelés mellett is a kijelzőt jelző ikon áll, vagyis mindegyik külön állítható.

Irány

A konténer irányát (Sor vagy Oszlop) töréspontonként külön adhatod meg. Így asztali gépen egymás mellett álló widgetek mobilon könnyen egymás alá kerülnek.

1. Válaszd a Mobil vagy a Táblagép nézetet.
2. Jelöld ki a konténert.
3. Az Elrendezés fül Tételek részében válaszd ki az Irány értékét.

Szélesség és magasság eszközönként

A konténer és a benne lévő elemek szélessége és magassága is nézetenként módosítható. Mivel az elrendezés rugalmas dobozokra (flexbox) épül, a szokásosnál kevesebb egyedi töréspontra van szükség.

• A konténer Szélesség és Minimális magasság mezője az Elrendezés fül Tároló szakaszában van.
• A benne lévő elemek szélességét a Haladó fül Elrendezés szakaszában állítod.

Sorrend eszközönként

Az egyéni Sorrend beállítással megadhatod a widgetek és a konténerek sorrendjét töréspontonként. Így nem kell külön szakaszokat készítened, amelyeket eszközönként elrejtesz. A beállítás a Haladó fülön van, részletesen a Haladó fül beállításai fejezetben.

Kapcsolódó fejezetek

• A Flexbox konténerek működése
• Konténer megjelenítése vagy elrejtése eszközönként
• Alapelrendezések konténerekkel