Skip to main content
O elemento Box é uma das ferramentas de layout mais importantes do LanderLab. Ele permite agrupar, organizar e controlar os elementos da sua página com mais precisão.

​
O que é um Box?

Um Box é um contêiner que guarda outros elementos dentro dele. Você pode colocar dentro de um box:
  • Textos
  • Imagens
  • Botões
  • Listas
  • Outros boxes
👉 Pense nele como um invólucro que ajuda a estruturar o seu conteúdo.
Observações importantes
  • Os boxes são essenciais para estruturar layouts
  • Você pode aninhar boxes para ter mais flexibilidade
  • Eles resolvem a maioria dos problemas de alinhamento e espaçamento

​
Como adicionar um Box

  • Abra a barra lateral esquerda
  • Vá até Layout
  • Arraste Box para dentro de uma seção ou coluna

​
Por que os boxes são importantes

Os boxes dão mais controle sobre como os elementos são organizados. Você os usa para:
  • Agrupar elementos relacionados
  • Alinhar os elementos corretamente
  • Criar layouts mais avançados
  • Ajustar com precisão o espaçamento e o posicionamento
👉 A maioria dos layouts detalhados depende de boxes para funcionar corretamente.

​
Como os boxes funcionam

Exemplo de estrutura:
Seção → Colunas → Box → Elementos
  • Um box fica dentro de colunas ou seções
  • Os elementos ficam dentro do box
  • Você pode colocar boxes dentro de outros boxes para ter mais controle

​
Controle de layout

Com um box selecionado, você pode controlar:
  • Direction → layout em linha ou em coluna
  • Alignment → posição dos elementos (esquerda, centro, direita)
  • Distribution → distribuir os elementos de forma uniforme
  • Gap → espaço entre os elementos
É aqui que acontece a maior parte dos ajustes de layout.

​
Opções de estilo

Os boxes também oferecem:
  • Fundos (cor ou gradiente)
  • Espaçamento (padding e margin)
  • Bordas e arredondamento
  • Sombras
  • Largura e altura