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

waker
  • 565

clipboard.png
,
想把这个按钮垂直居中,不会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>

回复
阅读 25.7k
3 个回答

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

float不要和absolute一起用

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

你知道吗?

宣传栏