Nakładanie – czyli jak
umieścić na sobie dwa
Moduły w szablonie DIVI

PRZYKŁADOWE KODY CSS W POŁĄCZENIU Z RÓŻNYMI MODUŁAMI

Nałożenie na siebie dwóch modółw

Nałożenie na siebie 3 modółów (obraz jako warstwy)

Nałożenie na siebie 3 modółów (tekst - obraz - tekst)

Nałożenie na siebie dwóch modułów

Poniżej nałożone zostały na siebie dwa moduły: Tytuł posta i Galeria. W ustawieniach wiersza:

  • wymuszony został tryb pełnej szerokości
  • rozstaw kolumn przy użyciu niestandardowych szerokości rynny został ustawiony na 1
  • w zaawansowanych ustawieniach wiersza, w polu „Kolumna1 Główny element” został umieszczony niestandardowy kod css:

z-index:2;
position: relative;
width: 200px;
border: 1px solid #000000
overflow: visible;
padding-left: 60px;

  • w zaawansowanych ustawieniach, w polu „Kolumna2 Główny element” został umieszczony niestandardowy kod css:

z-index:1;

  • w ustawienia modułu „Tytuł posta” w zakładce „Design” ustawiono margines górny na 70px, margines lewy na 50px.

Divi: Nakładanie, czyli jak umieścić na sobie dwa moduły

utworzone przez | Paź 13, 2016 | CSS/HTML, Divi, Elegant Themes, Motywy | 0 komentarzy

Nałożenie na siebie 3 modułów
(obraz jako warstwy)

Poniżej nałożone zostały na siebie trzy moduły: obraz, obraz i obraz. W ustawieniach zaawansowanych wiersza, w wybranych polach zostały dodane następujące, niestandardowe kody CSS:

„Kolumna1 Główny element”

position: absolute;
z-index: 1;

„Kolumna2 Główny element”

position: absolute;
left: 80px;
top: 80px;
z-index: 2;

„Kolumna3 Główny element”

position: absolute;
left: 150px;
top: 150px;
z-index: 3;

Nałożenie na siebie 3 modułów
(tekst – obraz – tekst)

Poniżej nałożone zostały na siebie 3 moduły: Tekst, Obraz i Tekst.

  • W ustawieniach Wiersza wymuszony został tryb pełnej szerokości.
  • W ustawieniach Wiersza, w zakładce zaawansowane, w polu „Główny element kolumny 1” został dodany kod css:

z-index:2;
width:250px;
left:80px;
bottom:10px;

  • W ustawieniach Wiersza, w zakładce zaawansowane, w polu „Główny element kolumny 2” został dodany kod css:

z-index:1;

  • W ustawieniach Wiersza, w zakładce zaawansowane, w polu „Główny element kolumny 3” został dodany kod css:

z-index:2;
width:250px;
right:80px;
bottom:10px;

W tym miejscu znajduje się tekst, który zostanie nałożony na obraz znajdujący się na środkowym module. 
W tym miejscu znajduje się tekst, który zostanie nałożony na obraz znajdujący się na środkowym module. 

by Paulina Kanak

właścicielka domen Canaq.net | Canaq.pl

© Copyright 2014 | Wszelkie prawa zastrzeżone
cq.canaq@gmail.com

Pin It on Pinterest