Alinhar elementos em uma página

Neste artigo, você aprenderá como alinhar elementos na sua página PageFly.

Etapa 1: selecionar o contêiner do elemento

No nosso exemplo, há uma seção com 2 colunas. Na coluna da direita, temos os elementos Título, Parágrafo e Botão.

Primeiro de tudo, precisamos entender como os elementos estão contidos na página. Por exemplo, selecionamos o elemento Botão e a trilha de navegação mostra seus contêineres: Seção – Linha – Coluna – Botão.

Como queremos alinhar esse botão, precisamos selecionar seu contêiner, que é a coluna na trilha de navegação.

Etapa 2: Alinhar todos os elementos no contêiner selecionado

Antes de seguir as etapas específicas, você pode assistir ao vídeo abaixo

Agora, queremos alinhar ao centro o elemento Botão , selecione a coluna> guia Estilo> seção TIPOGRAFIA> clique no ícone Central em Alinhamento de texto, conforme a imagem abaixo

Etapa 3: Alinhar um elemento específico dentro de um contêiner

Nesse caso, ainda queremos que o cabeçalho e o parágrafo estejam alinhados à esquerda, assim como o seguinte:

• Escolha o contêiner do texto do título, que é o elemento Título.
• Vá até a aba Estilo no Inspetor de Elementos ao lado direito.
• Clique no ícone Esquerda em Alinhamento de texto da seção TIPOGRAFIA.

Faça o mesmo com o parágrafo selecionando Elemento do parágrafo> guia Estilo> seção TIPOGRAFIA> Ícone esquerdo em Alinhamento de texto. Como resultado, você verá algo como a imagem abaixo.

A prioridade das configurações de estilo

Lembre-se de que as configurações de elementos aninhados têm prioridade mais alta que as de seus contêineres. Por exemplo, se você definir o alinhamento da coluna como “centro”, mas o elemento de parágrafo nessa coluna estiver definido como “esquerda”, esse parágrafo será alinhado à esquerda.