---
url: "/pt/emailify/design/item-spacing.md"
description: "Ajuste o espaçamento entre camadas com a propriedade Item Spacing do Auto Layout e use o espaçador do Emailify para um espaçamento vertical extra."
---

# Espaçamento entre itens e espaçadores nos seus e-mails

> Ajuste o espaçamento entre camadas com a propriedade Item Spacing do Auto Layout e use o espaçador do Emailify para um espaçamento vertical extra.

## Mudar o espaçamento padrão entre itens do Auto Layout nas suas camadas {#changing-the-default-auto-layout-item-spacing-for-your-layers}

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

Ajustando a propriedade **Item Spacing** das suas camadas Row, Column ou de outras camadas de layout do Emailify (como um Wrapper, um Hero ou um contêiner de ícones de redes sociais), você define o espaçamento padrão entre os elementos filhos dentro dessa camada.

Por exemplo, definir um espaçamento entre itens de `16` em uma camada Column distribui um espaçamento uniforme (16 pixels) entre todos os elementos (por exemplo, textos, imagens, botões etc.) dentro dessa camada Column.

## Adicionar espaçadores verticais personalizados às suas colunas {#adding-custom-vertical-spacer-elements-to-your-columns}

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

Se você já definiu o espaçamento padrão entre itens, mas ainda precisa de um pouco mais de espaço vertical entre determinadas camadas da sua Column, pode adicionar um espaçador especial do Emailify: clique na camada “Column”, selecione o item “Spacer” no menu suspenso Quick Add, na parte de baixo do plugin, e clique no botão **Add +** para inserir a camada de espaçador na Column.

Depois de adicionar a camada de espaçador à Column, você pode arrastá-la no painel de camadas para mudar entre quais camadas ela fica e ajustar o tamanho dela mudando a **Height** da camada no painel de propriedades de camada do Figma.

> **Info:** Os espaçadores personalizados também ficam cercados pelo Item Spacing padrão do elemento pai, então leve isso em conta ao definir o valor de Height do espaçador.

## Adicionar espaçamento vertical automático entre as camadas da coluna {#adding-automatic-vertical-item-spacing-between-your-column-layers}

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

Para manter uma camada no topo de uma Column e outra na parte de baixo, defina o dimensionamento vertical de Auto Layout da Column como **Fill container**. Depois, defina o **Item spacing** como **Auto**. O Figma distribui o espaço disponível entre as camadas conforme o tamanho do conteúdo muda.

> **Tip:** **Defina um valor de espaçamento entre itens diferente para o celular**. Se você usar esse método para criar um layout vertical dividido no design de desktop, também deve adicionar um ajuste de Item Spacing para o celular: clique na mesma camada “Column” em que aplicou as etapas acima, clique no botão **Settings**, ative a opção **Mobile Item Spacing** e digite o valor que quiser (em pixels) para que o espaçamento entre itens tenha um tamanho fixo e consistente no celular (independentemente do tamanho do espaçamento “auto” no desktop).

## Adicionar margem vertical personalizada entre os parágrafos das camadas de texto {#adding-custom-vertical-margin-spacing-between-your-text-layer-paragraphs}

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

Você pode personalizar o espaçamento vertical entre os parágrafos das camadas de texto do Figma abrindo o painel de propriedades de texto do Figma e ajustando o valor de **Paragraph spacing** na aba **Basics**. Esse valor define quanto `margin-bottom` adicionar às tags `` dentro do conteúdo dessa camada de texto quando o e-mail HTML é gerado.

> **Tip:** Se você adicionou linhas de parágrafo extras (por exemplo, apertando `Enter` ou `Return` duas vezes para criar um espaço duplo), o parágrafo extra _vazio_ continua sendo incluído, e o espaçamento entre parágrafos personalizado também é adicionado como `margin-bottom` abaixo dele. Se quiser ter um controle mais preciso do espaçamento entre parágrafos no seu texto, você pode remover esses parágrafos extras ou em branco (como no vídeo acima).

> **Tip:** Você pode [aplicar configurações em massa](/pt/emailify/design/settings#apply-settings-in-bulk) abrindo **Settings** e selecionando no Figma várias camadas do Emailify do mesmo tipo. Qualquer configuração que você alterar será aplicada a todas as camadas selecionadas.
