---
url: "/fr/emailify/design/item-spacing.md"
description: "Ajustez l’espacement entre les calques avec la propriété Item Spacing de l’Auto Layout, et utilisez un élément Spacer d’Emailify pour un espacement vertical sur mesure."
---

# Ajouter de l’espacement entre éléments et des éléments Spacer à vos designs d’email

> Ajustez l’espacement entre les calques avec la propriété Item Spacing de l’Auto Layout, et utilisez un élément Spacer d’Emailify pour un espacement vertical sur mesure.

## Modifier l’espacement par défaut de l’Auto Layout entre les éléments de vos calques {#changing-the-default-auto-layout-item-spacing-for-your-layers}

[Video](/assets/videos/emailify/design/adding-item-spacing.mp4)

En ajustant la propriété **Item Spacing** de vos calques Row, Column ou d’autres calques de mise en page Emailify (comme un Wrapper, un Hero ou un conteneur d’icônes de réseaux sociaux), vous définissez l’espacement par défaut entre les éléments enfants de ce calque.

Par exemple, une valeur d’espacement de `16` sur un calque Column répartit un espacement égal (16 pixels) entre tous les éléments (par exemple textes, images, boutons, etc.) de ce calque Column.

## Ajouter des éléments d’espacement vertical personnalisés à vos colonnes {#adding-custom-vertical-spacer-elements-to-your-columns}

[Video](/assets/videos/emailify/design/adding-spacer-elements.mp4)

Si vous avez déjà défini l’espacement par défaut entre les éléments mais avez encore besoin d’un peu d’espace vertical entre certains calques de votre Column, vous pouvez ajouter un élément Spacer spécial d’Emailify : cliquez sur votre calque « Column », choisissez l’élément « Spacer » dans le menu déroulant Quick Add en bas du plugin, puis cliquez sur le bouton **Add +** pour insérer le calque d’espacement dans votre Column.

Une fois le calque d’espacement ajouté à votre Column, vous pouvez le glisser-déposer dans le panneau des calques pour choisir entre quels calques il se place, puis ajuster sa taille en modifiant sa **Height** dans le panneau des propriétés du calque Figma.

> **Info:** Les éléments Spacer personnalisés sont aussi entourés de l’Item Spacing par défaut de leur élément parent : tenez-en compte lorsque vous définissez la valeur Height de votre Spacer.

## Ajouter un espacement vertical automatique entre les calques de vos colonnes {#adding-automatic-vertical-item-spacing-between-your-column-layers}

[Video](/assets/videos/emailify/design/vertical-auto-layout-split.mp4)

Pour garder un calque en haut d’une Column et un autre en bas, réglez le dimensionnement vertical de l’Auto Layout de la Column sur **Fill container**. Réglez ensuite **Item spacing** sur **Auto**. Figma répartit l’espace disponible entre les calques à mesure que la longueur du contenu change.

> **Tip:** **Remplacez la valeur d’espacement entre éléments sur mobile**. Si vous utilisez cette méthode pour créer une mise en page verticale scindée sur desktop, ajoutez aussi une valeur de remplacement mobile pour l’Item Spacing : cliquez sur le calque « Column » auquel vous avez appliqué les étapes ci-dessus, cliquez sur le bouton **Settings**, activez l’option **Mobile Item Spacing** et saisissez la valeur de votre choix (en pixels), pour que l’espacement entre éléments soit fixe et constant sur mobile (quelle que soit la taille de l’espacement « auto » sur desktop).

## Ajouter une marge verticale personnalisée entre les paragraphes de vos calques de texte {#adding-custom-vertical-margin-spacing-between-your-text-layer-paragraphs}

[Video](/assets/videos/emailify/design/paragraph-spacing.mp4)

Vous pouvez personnaliser l’espacement vertical entre les paragraphes de vos calques de texte Figma : ouvrez le panneau des propriétés de texte de Figma, puis ajustez la valeur **Paragraph spacing** dans l’onglet **Basics**. Elle détermine la marge `margin-bottom` ajoutée aux balises `` du contenu de ce calque de texte lors de la génération de votre email HTML.

> **Tip:** Notez que si vous avez ajouté des lignes de paragraphe supplémentaires (par exemple en appuyant deux fois sur `Enter` ou `Return` pour créer un double espace), le paragraphe supplémentaire _vide_ est tout de même inclus, et l’espacement de paragraphe personnalisé est également ajouté en `margin-bottom` sous celui-ci. Pour contrôler plus finement l’espacement des paragraphes de votre texte, vous pouvez supprimer ces paragraphes supplémentaires ou vides (comme dans la vidéo ci-dessus).

> **Tip:** Vous pouvez [appliquer des réglages en masse](/fr/emailify/design/settings#apply-settings-in-bulk) : ouvrez **Settings**, puis sélectionnez dans Figma plusieurs calques Emailify du même type. Chaque réglage que vous modifiez s’applique alors à tous les calques sélectionnés.