---
title: "[CSS] Centrer verticalement un module Divi"
description: "Dans certains cas, il est nécessaire de centrer verticalement du contenu dans un module Divi. Les options natives ne permettent pas toujours d’obtenir ce résultat, mais il est possible d’y parvenir avec du CSS. ## Contenu avancé Cet article utilise…"
url: "https://academy.drgeek.com/docs/avance/divi-code/css-centrer-verticalement-un-module-divi/"
updated: "2026-03-19"
category: Avancé / Divi (code)
tags:
  - Avancé
---

# [CSS] Centrer verticalement un module Divi

Dans certains cas, il est nécessaire de centrer verticalement du contenu dans un module Divi. Les options natives ne permettent pas toujours d’obtenir ce résultat, mais il est possible d’y parvenir avec du CSS.

## Contenu avancé

Cet article utilise du code CSS. Une mauvaise manipulation peut impacter l’affichage de votre site.

## Objectif

Centrer verticalement le contenu d’un module Divi.

## Solution avec Flexbox

Dans le module Divi, ouvre l’onglet Avancé, puis ajoute le code suivant :

```
selector {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
```

## Comprendre le fonctionnement

- **display: flex;** active le mode Flexbox
- **flex-direction: column;** organise le contenu verticalement
- **justify-content: center;** centre le contenu verticalement

## Cas d’utilisation

- Centrer du texte dans une colonne
- Aligner un bouton verticalement
- Créer des blocs visuellement équilibrés

## Points d’attention

- Le mot-clé `selector` fonctionne uniquement dans Divi
- Ce code modifie le comportement du module
- Peut impacter l’alignement des éléments internes

## Astuce utile

- Le centrage vertical nécessite une hauteur disponible
- Active Harmoniser les hauteurs des colonnes dans les paramètres de la ligne

![](https://academy.drgeek.com/wp-content/uploads/2026/03/avance-css-aligner-centre-hauteur.jpg)

## Pourquoi cela ne fonctionne parfois pas

Si le contenu ne se centre pas correctement, c’est généralement parce que la colonne n’a pas de hauteur définie. Sans hauteur, le centrage vertical n’a aucun effet visible.

## Compatibilité

Avec les versions récentes de Divi, certaines options de centrage sont disponibles directement dans l’interface. Cette méthode reste utile dans des cas spécifiques ou plus avancés.

## Pour conclure

Flexbox est une solution simple et efficace pour centrer verticalement du contenu dans Divi lorsque les options natives ne suffisent pas.