div中放入button,怎么让button垂直居中

Question

,
想把这个按钮垂直居中,不会css,百度了一些方案,不知道得怎么搞?

我自己写的样式

<div class='inner' style="position:relative">
<input type="text" id='mobile' placeholder="请输入手机号码" />
<button style="display:inline-block;float:left;height:20px;margin-top:10px;">发送验证码</button>
</div>

最后凑成功了

<div class='inner' style="position:relative">
<input type="text" id='mobile' placeholder="请输入手机号码" />
<button style="style="display:inline-block;float:left;height:20px;margin-top:10px;position: absolute;top:50%;"">发送验证码</button>
</div>

Answer 1

div不要设定高度，button多高，div就多高，如果div与button要留点距离，给div设定padding，这样不管button多高，都是“居中的”(不仅仅可以居中，上多少下多少可以自己控制)，

Answer 2

float不要和absolute一起用

Answer 3

absolute的时候可能需要同时使用top和margin-top的负值，或者使用flex，或者使用calc属性