input明明写在同一行,高度也一样,在不同的浏览器或者手机上显示却不一样,经常会出现这样的情况

<input type="text" name="verify" placeholder ="请输入验证码" class="verify" /><input type="button" value="发送验证码" class="verify_code" />

两个input在一行让它们能对齐

加margin,padding都没能解决这个问题,网上搜了看到有人说给两个input加float可以实现对齐,鉴于浮动带来的一系列副作用来讲,

浮动虽然能解决这个问题,但浮动并不是最好的方法

实践中发现了另一个很好的解决办法,就是用我们熟悉的line-height

input{height:30px;line-height:30px;}

两个input在一行让它们能对齐

这样就好了,解决这个问题

 

相关文章:

  • 2021-06-24
  • 2022-12-23
  • 2022-12-23
  • 2021-11-08
  • 2022-12-23
  • 2021-12-18
猜你喜欢
  • 2021-08-11
  • 2022-02-11
  • 2021-12-18
  • 2022-12-23
  • 2021-11-20
  • 2021-06-24
  • 2022-12-23
相关资源
相似解决方案