Construtor de flexbox CSS

Teste base, crescimento, quebra e alinhamento; exporte HTML/CSS.

  • Funciona no navegador
  • Sem envio
  • Verifique antes de transferir

Os dados de entrada ficam neste separador, sem envio ou gravação automática. As contagens agregadas de utilização e os diagnósticos gerais de processamento são opcionais e enviados apenas com consentimento, sem conteúdo nem nomes de ficheiros. Limpar ou fechar elimina os dados; guarde primeiro os resultados necessários.

Limites de recursos

De 1 a 24 elementos; base de 0 a 2000 px, crescimento e encolhimento de 0 a 20, ordem de ±24, espaçamento de 0 a 100 px. A pré-visualização usa a largura disponível. A ordem visual não altera o DOM, a leitura nem o teclado. A pré-visualização local é limitada e não garante o mesmo resultado em todos os navegadores e disposições. As entradas não são executadas. Transfira o HTML e o CSS em conjunto. Limite: 8 segundos.

Elementos 1
Elementos 2
Elementos 3

Como utilizar

  1. Configurar o exemplo

    Escolha a direção, a quebra de linha e o alinhamento; edite a base, o crescimento, o encolhimento e a ordem. Clique em Gerar e compare as posições na largura disponível. Exporte o HTML e o CSS em conjunto.

  2. Verificar antes de utilizar

    Os dados de entrada ficam neste separador, sem envio ou gravação automática. As contagens agregadas de utilização e os diagnósticos gerais de processamento são opcionais e enviados apenas com consentimento, sem conteúdo nem nomes de ficheiros. Limpar ou fechar elimina os dados; guarde primeiro os resultados necessários. De 1 a 24 elementos; base de 0 a 2000 px, crescimento e encolhimento de 0 a 20, ordem de ±24, espaçamento de 0 a 100 px. A pré-visualização usa a largura disponível. A ordem visual não altera o DOM, a leitura nem o teclado. A pré-visualização local é limitada e não garante o mesmo resultado em todos os navegadores e disposições. As entradas não são executadas. Transfira o HTML e o CSS em conjunto. Limite: 8 segundos.

  3. Exportar o resultado verificado

    Transferir resultado; Transferir original

Perguntas e limites

Limites de recursos

De 1 a 24 elementos; base de 0 a 2000 px, crescimento e encolhimento de 0 a 20, ordem de ±24, espaçamento de 0 a 100 px. A pré-visualização usa a largura disponível. A ordem visual não altera o DOM, a leitura nem o teclado. A pré-visualização local é limitada e não garante o mesmo resultado em todos os navegadores e disposições. As entradas não são executadas. Transfira o HTML e o CSS em conjunto. Limite: 8 segundos.

Design offline

Os dados de entrada ficam neste separador, sem envio ou gravação automática. As contagens agregadas de utilização e os diagnósticos gerais de processamento são opcionais e enviados apenas com consentimento, sem conteúdo nem nomes de ficheiros. Limpar ou fechar elimina os dados; guarde primeiro os resultados necessários.

Verificar antes de utilizar

Escolha a direção, a quebra de linha e o alinhamento; edite a base, o crescimento, o encolhimento e a ordem. Clique em Gerar e compare as posições na largura disponível. Exporte o HTML e o CSS em conjunto.