Supercentralizado
Use place-items: center
para centralizar um elemento no pai.
Primeiro, especifique a grade como o método de exibição e escreva place-items: center
no mesmo elemento. place-items
é uma abreviação para definir align-items
e justify-items
de uma só vez. Ao defini-lo como center
, align-items
e justify-items
serão definidos como center
.
.parent {
display: grid;
place-items: center;
}
Isso permite que o conteúdo fique perfeitamente centralizado no pai, independentemente do tamanho intrínseco.
<div class="parent">
<div class="box" contenteditable="">
:)
</div>
</div>
.parent {
display: grid;
place-items: center;
/* Just for parent demo size */
height: 100vh;
}
Exceto em caso de indicação contrária, o conteúdo desta página é licenciado de acordo com a Licença de atribuição 4.0 do Creative Commons, e as amostras de código são licenciadas de acordo com a Licença Apache 2.0. Para mais detalhes, consulte as políticas do site do Google Developers. Java é uma marca registrada da Oracle e/ou afiliadas.
Última atualização 2023-10-25 UTC.
[null,null,["Última atualização 2023-10-25 UTC."],[],[]]