0

Tenho o body e uma div com width: 320px;

Gostaria de centralizá-la no body que é flex.

Mas veja só, NÃO quero centralizar seu conteúdo.

Gostaria de centralizar a própria div na body.

    body {
       display: flex;
    }
       
    div#tudo {
       display: flex;
       width: 320px;
    }
<body>

    <div id=tudo>

          <label>teste</label>

    </div>

</body>

Uso margin: 0 auto ou tem algum recurso flexbox para isso?

O que eu busco é por uma propriedade que faça semelhante ao resultado do align-self: center. Porém, na horizontal.

6
  • Já tentou utilizar o margin que cita? Qual foi o resultado? E se não quer usar flex, não fez muito sentido pedir como faz em flex. Aliás, isso deve ter várias duplicadas no site. Chegou a pesquisar?
    – Woss
    10/07/2019 às 11:19
  • Centralizar na horizontal ou vertical?
    – hugocsl
    10/07/2019 às 11:22
  • Olá Antônio. Bom dia! Então, com margim dá certo Mas quero passar a usar o flex. Nao fui muito feliz na minha colocação. O que eu busco na verdade é algo semelhante à align-self mas para a horizontal. Acho que não tem né? 10/07/2019 às 11:23
  • 1
    Bom, adicionei informações à pergunta. Se puder ler... Agradeço! Mas vou ler as tuas referências! 10/07/2019 às 11:29
  • 2
    Relacionada ou nova duplicada: pt.stackoverflow.com/questions/355954/…
    – Woss
    10/07/2019 às 11:36

1 Resposta 1

-3
#envolve {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 320px;
}

<body>
<div id="envolve">
<div id=tudo>

      <label>teste</label>

</div>
</div>
</body>

tenta isso pra ver se resolve

8
  • Por que isso resolveria o problema?
    – Woss
    10/07/2019 às 11:34
  • Amigão. Não centralizou. Mas, conforme o Antônio disse, parece que o que estou procurando não existe no flex ou o que estou querendo fazer não é uma boa prática. Obrigado pelo teu tempo. Estou lendo a referência que ele passou! 10/07/2019 às 11:34
  • Ok amigo, é sempre bom dar uma estudada antes de usar as propriedades... 10/07/2019 às 11:39
  • mas na realidade o código que você quer é esse mesmo que eu postei, só não funcionou por que eu esqueci de definir a altura e a largura da div "envolve" com a largura máxima da Tela 10/07/2019 às 11:43
  • 2
    @DemetriusFernandes Talvez tenha entendido errado o propósito do site. O objetivo do Stack Overflow é justamente ser um repositório de conhecimento que utiliza o formato perguntas e respostas, em que, idealmente, a pergunta apresenta um problema e a resposta apresenta uma descrição da solução como propósito de servidor como fonte de pesquisa para a comunidade. Dar um código pronto e dizer para o usuário "se virar sozinho" para entender é exatamente o oposto do que o site propõem. Se quiser, no Stack Overflow em Português Meta já existem várias discussões sobre isso.
    – Woss
    10/07/2019 às 12:46

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .