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. bootstrap 页面标题

    页面标题会突出显示,当一个网页中有多个标题且每个标题之间需要添加一定的间距时,页面标题显得特别有用,页面标题会给不是页面标题之间的元素加上横线 加以区分,以突出标题显示. 页面标题类 显示效果图 代码 ...

  2. Redis Key过期通知

    概述 键空间通知使得客户端可以通过订阅频道或模式, 来接收那些以某种方式改动了 Redis 数据集的事件.如Redis数据库中键的过期事件也是通过订阅功能实现.本文主要基于Azure PaaS Red ...

  3. python selenium --frame

    本节知识点: 多层框架或窗口的定位: switch_to_frame() switch_to_window() 智能等待: implicitly_wait() 对于一个现代的web应用,经常会出现框架 ...

  4. HDOJ 5418 Victor and World 状压DP

    水状压DP Victor and World Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 262144/131072 K (Java ...

  5. Canvas转换为Blob对象并使用Ajax发送

    Canvas转换为Blob对象并使用Ajax发送 转换为Blob对象后,可以使用Ajax上传图像文件. 先从canvas获取dataurl, 再将dataurl转换为Blob对象 var dataur ...

  6. DirectShow中写push模式的source filter流程 + 源码(内附具体凝视)

    尽管网上已有非常多关于DirectShow写source filter的资料.只是非常多刚開始学的朋友总说讲的不是非常清楚(可能当中作者省略了很多他觉得简 单的过程).读者总希望看到象第一步怎么做,第 ...

  7. netty4.1.32 pipeline的添加顺序和执行顺序

    本文只想讨论一下pipeline的执行顺序问题,因为这个搞不明白就不知道先添加编码还是解码,是不是可以混淆添加等等一系列事情 pipeline.addLast(new outboundsHandler ...

  8. linux下时间操作1

    本文是对我之前写的文章:C++时间操作 的更深入补充.之前那个文章就是一个快速入门的东西,后面力图把一些更深入的细节补充完整. 时间分类的基本介绍 在介绍一些时间相关的操作函数之前,先来介绍一下lin ...

  9. ny82 迷宫寻宝(一) map+queue

    题目地址:http://acm.nyist.net/JudgeOnline/problem.php?pid=82 AC代码:讲解,先统计在可搜索范围内对应的钥匙数,把搜到的门存到另外的一个队列中,第一 ...

  10. 李洪强iOS开发之iOS好文章收集

    李洪强iOS开发之iOS好文章收集 该文收集朋友们转发或自己的写的技术文章,如果你也有相关的好文章,欢迎留言,当好文章多的时候,我会对这些好文章进行分门别类 文章 简述 日期 直播服务配置 使用 ng ...