centrowanie w pionie

Question

<div class="ui-grid-b ui-responsive" style="background:rgba(170,165,155,0.5); height:15%;">
    <div class="ui-block-a"><div class="ui-body ui-body-d"><h2>A</h2></div></div>
    <div class="ui-block-b"><div class="ui-body ui-body-d"><input type="number"></div></div>
    <div class="ui-block-c"><div class="ui-body ui-body-d"><h2>B</h2></div></div>
</div>

 

Mam taki kod i pytanie jak elementy h2 oraz inputa wyśrodkować w pionie?

 

Answer 1

Masz kilka sposobów:

1. na elementy które chcesz wyzrodkowac dajesz position absolute, top 50% i transforme translateY (-50%) oraz na rodzica position relative

2. Na rodzica dajesz display flex, flex-direction row, align-items center