Normalmente coloco position: absolute/relative (dependendo), tranformY(50%) e top: -50%, porém, conforme vou adicionando mais elementos essa artimanha começa a falhar. Gostaria de um resultado como o da imagem. Quais os outros artifícios que vocês costumam usar?
1 Resposta
display flex no container com align-items: center
.container {
display: flex;
align-items: center;
}
ou, se vc precisa de mais cross-browser, display inline-block nos childrens com vertical-align: middle
.children {
display: inline-block;
vertical-align: middle;
}