{"id":24282,"date":"2026-11-13T13:53:33","date_gmt":"2026-11-13T13:53:33","guid":{"rendered":"https:\/\/wptablebuilder.com\/docs\/vertical-alignment-content-distribution\/"},"modified":"2026-11-13T13:53:33","modified_gmt":"2026-11-13T13:53:33","password":"","slug":"vertical-alignment-content-distribution","status":"publish","type":"docs","link":"https:\/\/wptablebuilder.com\/fr\/docs\/vertical-alignment-content-distribution\/","title":{"rendered":"Comment r\u00e9gler l\u2019alignement vertical et la r\u00e9partition du contenu dans WP Table Builder"},"content":{"rendered":"
\n

R\u00e9ponse rapide<\/p>\n\n\n\n

Pour tout le tableau, ouvrez Settings<\/strong> (onglet), d\u00e9pliez Content Alignment<\/strong> et choisissez une valeur pour Vertical Alignment<\/strong> (Default, Top, Middle ou Bottom) ou pour Content Distribution<\/strong> (Normal, Space between, Space around ou Space evenly). Pour une ligne, une colonne ou une cellule, s\u00e9lectionnez une cellule et utilisez les m\u00eames options dans Cell Control<\/strong> ou Row & Column Control<\/strong>. L\u2019alignement vertical ne fonctionne que si Content Distribution est r\u00e9gl\u00e9 sur Normal<\/strong>.<\/p>\n<\/div>\n\n\n\n

L\u2019alignement vertical d\u00e9termine o\u00f9 se place le contenu dans une cellule quand celle-ci est plus haute que son contenu : en haut, au milieu ou en bas. La r\u00e9partition du contenu d\u00e9termine comment plusieurs \u00e9l\u00e9ments d\u2019une cellule se partagent l\u2019espace libre, par exemple pour placer un bouton en bas de chaque colonne d\u2019un tableau de prix.<\/p>\n\n\n

<\/div><\/div><\/div>\n\n\n

Pr\u00e9requis<\/h2>\n\n\n\n
\u00c9l\u00e9ment<\/th>D\u00e9tails<\/th><\/tr><\/thead>
Offre<\/strong><\/td>Gratuit et Pro<\/td><\/tr>
Version de l\u2019extension<\/strong><\/td>WP Table Builder 2.3.0 ou plus r\u00e9cent pour l\u2019alignement de tout le tableau (alignement des lignes et colonnes depuis la 2.1.12)<\/td><\/tr>
Temps n\u00e9cessaire<\/strong><\/td>Environ 1 minute<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n
<\/div><\/div><\/div>\n\n\n

Les options<\/h2>\n\n\n\n
R\u00e9glage<\/th>Options<\/th>Ce qu\u2019il fait<\/th><\/tr><\/thead>
Vertical Alignment<\/strong><\/td>Default, Top, Middle, Bottom<\/td>D\u00e9place tout le contenu de la cellule vers le haut, au centre ou vers le bas<\/td><\/tr>
Content Distribution<\/strong><\/td>Normal, Space between, Space around, Space evenly<\/td>R\u00e9partit les \u00e9l\u00e9ments d\u2019une cellule sur sa hauteur<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n

Important :<\/strong> L\u2019alignement vertical n\u2019a aucun effet tant que Content Distribution a une autre valeur que Normal<\/strong>. Le constructeur affiche cette remarque sous le r\u00e9glage.<\/p>\n\n\n

<\/div><\/div><\/div>\n\n\n

R\u00e9gler l\u2019alignement pour tout le tableau<\/h2>\n\n\n\n
    \n
  1. Ouvrez le tableau dans le constructeur et cliquez sur Settings<\/strong> .<\/li>\n\n\n\n
  2. Expand Content Alignment<\/strong>.<\/li>\n\n\n\n
  3. Choisissez une valeur pour Vertical Alignment<\/strong>, ou pour Content Distribution<\/strong>.<\/li>\n\n\n\n
  4. Cliquez sur Save<\/strong>.<\/li>\n<\/ol>\n\n\n\n
    \"Section<\/figure>\n\n\n
    <\/div><\/div><\/div>\n\n\n

    R\u00e9gler l\u2019alignement pour une ligne, une colonne ou une cellule<\/h2>\n\n\n\n
      \n
    1. Cliquez sur l\u2019espace vide d\u2019une cellule pour la s\u00e9lectionner.<\/li>\n\n\n\n
    2. Pour cette cellule uniquement, d\u00e9pliez Cell Control<\/strong> et utilisez Vertical Alignment<\/strong> et Cell content distribution<\/strong>.<\/li>\n\n\n\n
    3. Pour toute sa colonne ou sa ligne, d\u00e9pliez Row & Column Control<\/strong> et utilisez Column vertical alignment<\/strong>, Column content distribution<\/strong> ou Row vertical alignment<\/strong>.<\/li>\n<\/ol>\n\n\n\n

      Les r\u00e9glages de cellule l\u2019emportent sur ceux de colonne et de ligne, qui l\u2019emportent sur le r\u00e9glage du tableau entier.<\/p>\n\n\n

      <\/div><\/div><\/div>\n\n\n

      Exemple : aligner les boutons dans un tableau de prix<\/h2>\n\n\n\n

      Les colonnes de prix ont souvent des listes de fonctionnalit\u00e9s de longueurs diff\u00e9rentes, si bien que les boutons se retrouvent \u00e0 des hauteurs diff\u00e9rentes. R\u00e9glez Content Distribution<\/strong> sur Space between<\/strong> pour le tableau ou pour la ligne qui contient les listes et les boutons. Le premier \u00e9l\u00e9ment reste en haut et le dernier (le bouton) descend en bas, ce qui aligne tous les boutons.<\/p>\n\n\n

      <\/div><\/div><\/div>\n\n\n

      Questions fr\u00e9quentes<\/h2>\n\n\n
      \n
      \n\t\t\t
      \n\t\t\t

      Comment centrer verticalement du texte dans un tableau WP Table Builder ?<\/strong><\/p>\n\t\t\t

      <\/span><\/div>\n\t\t<\/div>\n\t\t\t
      \n\n

      Ouvrez l\u2019onglet Settings, d\u00e9pliez Content Alignment et r\u00e9glez Vertical Alignment sur Middle. V\u00e9rifiez que Content Distribution est sur Normal.<\/p>\n\n<\/div>\n\t\t<\/div>\n\n

      \n\t\t\t
      \n\t\t\t

      Pourquoi l\u2019alignement vertical ne change-t-il rien ?<\/strong><\/p>\n\t\t\t

      <\/span><\/div>\n\t\t<\/div>\n\t\t\t
      \n\n

      L\u2019alignement vertical ne fonctionne que si Content Distribution est sur Normal, et seulement quand la cellule est plus haute que son contenu, par exemple quand une autre cellule de la ligne contient plus de contenu.<\/p>\n\n<\/div>\n\t\t<\/div>\n\n

      \n\t\t\t
      \n\t\t\t

      Comment aligner les boutons en bas de chaque colonne ?<\/strong><\/p>\n\t\t\t

      <\/span><\/div>\n\t\t<\/div>\n\t\t\t
      \n\n

      R\u00e9glez Content Distribution sur Space between pour le tableau, la ligne ou les cellules qui contiennent les boutons.<\/p>\n\n<\/div>\n\t\t<\/div>\n\n

      \n\t\t\t
      \n\t\t\t

      Puis-je aligner une cellule diff\u00e9remment des autres ?<\/strong><\/p>\n\t\t\t

      <\/span><\/div>\n\t\t<\/div>\n\t\t\t
      \n\n

      Oui. S\u00e9lectionnez la cellule et modifiez Vertical Alignment ou Cell content distribution dans Cell Control.<\/p>\n\n<\/div>\n\t\t<\/div>\n<\/div>\n\n

      <\/div><\/div><\/div>\n\n\n

      Documents associ\u00e9s<\/h2>\n\n\n\n