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

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

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

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

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

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

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

两个input在一行让它们能对齐的更多相关文章

  1. 两个input在同一行连着不留缝隙

    方法1:让两个input 连在一起写 不换行 <div class="inputDiv"> <input type="text" placeh ...

  2. HTML问题 | 两个Input在同一行连着不留缝隙

    方法1:让两个 input 连在一起写 不换行 <div class="inputDiv"> <input type="text" place ...

  3. 看起来像一个输入框的input,实际上是有两个input

    看起来像一个输入框的input,实际上是有两个input

  4. 微信小程序-两个input叠加,多次点击字体变粗或闪动

    问题描述: 当两个input叠加,多次点击input框, placeholder 字体变粗或input框闪动.如图: 代码: <!-- 最上层input-1 --> <input p ...

  5. 【iview input 回车刷页面bug】input 就一个的时候 有form的时候 回车会刷页面,如果就一个input,可以不要form,或者form里面两个input 将一个input v-show false 就可以了

    [iview input 回车刷页面bug]input 就一个的时候 有form的时候 回车会刷页面,如果就一个input,可以不要form,或者form里面两个input 将一个input v-sh ...

  6. 在reset css后两个input之间还是出现默认间隔的问题。

    <div class="search_box fl"> <input type="text" class="search_text& ...

  7. react中IOS手机里面两个input同时存在时,聚焦focus失效解决办法

    最近在做webapp搜索功能时,用到两个input同时存在时,轻点input聚焦时,ios手机软键盘弹起又失效,一直在寻找合理的解决办法,现在最简单的总结回顾: <一>bug显示 < ...

  8. input 文本框和 img 验证码对齐问题

    input 文本框和 img 验证码对齐问题 在网页制作中,常将 input 和 img 放在同一行,img标签总是比input高出一个头,非常难看. CCS实现input和img水平对齐的方法 同时 ...

  9. input、button、文字的对齐水平对齐

    input.button.文字的对齐~! 1.input文本框下移的方法:padding-top ,可以解决文本框向下移. 2.input文本框和button对齐可以给他们外面加table (例如,谷 ...

随机推荐

  1. Nginx常用配置整理

    1.全局块:配置影响nginx全局的指令.一般有运行nginx服务器的用户组,nginx进程pid存放路径,日志存放路径,配置文件引入,允许生成worker process数等. worker_pro ...

  2. unity3d的三种平面坐标系

    unity3d有如下三种平面坐标系: 1.屏幕坐标系 2.视口坐标系viewport 3.GUI坐标系

  3. CSS经验库

    1.兼容360浏览器 字体大小设置 开发中需要使用em单位 font-size: 0.83em; font-family: "Arial"; -webkit-text-size-a ...

  4. Python 射线法判断一个点坐标是否在一个坐标区域内

    class Point: lng = '' lat = '' def __init__(self, lng, lat): self.lng = lng self.lat = lat # 求外包矩形 d ...

  5. Atitit .h5文件上传

    Atitit .h5文件上传 1. 上传原理1 2. Html1 3. Js2 4. uploadV2.js2 5. upServlet & FileUploadService {3 6. 注 ...

  6. HTML5自定义属性之data-index

    #使用jquery获取data-index的值 jquery 的版本最好高一些 #html <div id = 'div'><span data-field='demo'>&l ...

  7. vi全文替换命令

    1,$s/str1/str2/g:从第一行到最后一行把str1替换成str2

  8. scala读写文件

    def main(args: Array[String]): Unit = { //1 read for( i<- Source.fromFile("test.dat").g ...

  9. 上传图片时,使用JS获得图片文件大小

    这个方法用于获得图片文件的大小: 在FF,Chrome,IE6,IE7,IE8可用,不支持IE9+.(如果是IE9就需要flash插件了) var getSize = function(oFile,c ...

  10. poj3422 拆点法x->x'建立两条边+最小费用最大流

    /** 题目:poj3422 拆点法+最小费用最大流 链接:http://poj.org/problem?id=3422 题意:给定n*n的矩阵,含有元素值,初始sum=0.每次从最左上角开始出发,每 ...