Uwaga: Karty te przełączą się na układ 3-kolumnowy na tablecie, 2-kolumnowy na telefonie komórkowym i 1-kolumnowy na małym telefonie komórkowym. Możesz zmienić odległość nakładania się, która automatycznie zmieni odległość przesunięcia po najechaniu kursorem, edytując zmienną CSS u góry CSS w przełączniku Custom CSS w wierszu nadrzędnym. Pamiętaj, aby pozostawić jednostkę jako vw dla responsywności:

:root {
–wpziom-overlap-card-1-shift: 15vw;
}


Możesz mieć tyle kart, ile chcesz, duplikując wewnętrzne sekcje, a układ odpowiednio się dostosuje. Możesz także umieścić dowolną zawartość wewnątrz sekcji wewnętrznych, aby wykorzystać karty do różnych celów.

Jeśli chcesz odwrócić kolejność kart na mniejszych ekranach, możesz dodać ten CSS:

@media all and (max-width: 1024px) {
.wpziom-overlap-card-1 > .kt-inside-inner-col > .wp-block-kadence-column:nth-of-type(1) {
order: 5;
}
.wpziom-overlap-card-1 > .kt-inside-inner-col > .wp-block-kadence-column:nth-of-type(2) {
order: 4;
}
.wpziom-overlap-card-1 > .kt-inside-inner-col > .wp-block-kadence-column:nth-of-type(3) {
order: 3;
}
.wpziom-overlap-card-1 > .kt-inside-inner-col > .wp-block-kadence-column:nth-of-type(4) {
order: 2;
}
.wpziom-overlap-card-1 > .kt-inside-inner-col > .wp-block-kadence-column:nth-of-type(5) {
order: 1;
}
.wpziom-overlap-card-1 > .kt-inside-inner-col > .wp-block-kadence-column:nth-of-type(6) {
order: 0;
}
}

Jane Brown

Kierownik sprzedaży

twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst

John White

Dyrektor HR

twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst

Jess Gray

CEO

twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst

James Pink

Developer

twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst

Jen Green

Grafik

twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst twój tekst

Jack Black

CEO

twój tekst twój tekst twój tekst twój tekst