Lodret centreret indhold i Divi

Placér indhold centreret mellem top og bund i Divi.

Hvis du vil have lodret centreret indhold (altså placeret midt imellem toppen og bunden) i Divi er her hvordan du skal gøre. Da det i øjeblikket ikke muligt at få elementer placeret i midten af en kolonne i Divi uden at lave lidt ændringer selv, skal du indsætte lidt CSS-kode. Har du allerede har haft fingrene i HTML eller CSS, burde det dog ikke volde dig problemer.

Brug tematilpasser eller et undertema, når du laver ændringer

Du kan lave et hav af ændringer med CSS, så dit website med Divi-tema kommer til lidt mere personligt ud, og så længe du enten benytter et undertema (Læs også: “Hvad er et Child Theme?”) eller bruger WordPress’ indbyggede tematilpasser, beholder du ændringerne, når der kommer opdateringer til Divi-temaet. Det gælder også, når du som nu laver ændringer i den lodrette placering af elementer i en kolonne.

Vertikalt centreret indhold i Divi – sådan gør du

Det kræver som sagt lidt ekstra CSS at få ting til at stå i midten af en kolonne, men følger du disse 5 enkle trin kommer dit indhold til at være, hvor du ønsker det:

  1. Først åbner du Rækkeindstillinger ved at klikke på tandhjulet
  2. Så åbner du Kolonneindstillinger for den kolonne hvor indholdet skal justeres
  3. Gå til fanen Avanceret, find Brugerdefineret CSS og indsæt CSS-koden under Hovedelement
  4. Tryk OK for at vende tilbage til rækkeindstillingerne og gå til fanen Design
  5. Under punktet Skalering slår du Udjævn kolonnehøjder til Ja

Det var bare det. Nu vil elementet i kolonnen være lodret centreret – det vil sige justeret mellem toppen og bunden af kolonnen.

CSS-koden til lodret centreret indhold

Dette er CSS-koden du skal indsætte i kolonnens Hovedelement under Brugerdefineret CSS:

.et_pb_equal_columns >.et_pb_column {
margin-top:auto;
margin-bottom:auto;
}

Bonusinfo: Gør det samme for alle kolonner

Hvis du indsætter CSS-koden i feltet Brugerdefineret CSS, som du finder i kontrolpanelet under Divi > Temaindstillinger, vil alle kolonner hvor du slår Udjævn kolonnehøjder til blive centreret lodret.

Hvad er Divi?

Divi er et af verdens mest avancerede temaer til WordPress. At kalde Divi for et tema er faktisk lidt misvisende, for selvom Divi på overfladen bare ligner ét blandt millioner af WordPress-temaer, ligger styrken i den indbyggede Divi Builder. Med Divi Builder kan du lave skabeloner, genbruge elementer og layouts på kryds og tværs og lave et avanceret WordPress-site, fuldstændigt efter dit hoved.

Divi er ikke gratis, men når du først får lært at udnytte alle de muligheder, der ligger i Divi, vil du ikke have behov for at købe andre temaer.

Læs mere om Divi hos Elegant Themes, der er skaberne af Divi.

Christian Johannesen

Ekspert i digitale medier og digital  markedsføring

Hvad kan jeg hjælpe dig med?

  • Digital markedsføring
  • Hjælp til sociale medier
  • Virtuel assistent
  • Udvikling og drift af e-handel
  • Automatisering af arbejdsgange
  • Undervisning i brug af software

Hvem løser løser jeg opgaver for?

  • Enkeltmandsvirksomheder
  • Små og mellemstore virksomheder
  • Offentlige institutioner og skoler
  • Foreninger og klubber

Hvordan får du fat i mig?

Skriv til [email protected]
eller ring på 36 96 95 94