原因是 input和button的高度计算不一样,

input高度不包括border。

button高度包括border。

解决方法:

1、box-sizing:border-box;

2、border:0px;用box-shadow模拟border;box-shadow:0px 0px 1px black;

以上要ie8才支持。

如果要支持ie6、7、8就需要hack下,input改小一点height了。

input和button 高度不一致问题的更多相关文章

  1. 解决chrome浏览器对于自动填充的input表单添加的默认的淡黄色背景问题 && 一般的浏览器input和button的高度不一致问题

    解决chrome浏览器对于自动填充的input表单添加的默认的淡黄色背景问题 如果我们把一个表单设置位 autofocus ,这时这个表单在获取焦点后就会产生淡黄色的背景,我们就是使用!importa ...

  2. css中input与button在一行高度不一致的解决方法

    在写html表单的时候,发现了一个问题:input和button设置了一样的宽高,但是显示高度确不一致,先看代码: <style> input,button{ width:100px; h ...

  3. input type=button设置高度不管用

    <input type="button" name="calRate" id="calRate" value="查询&quo ...

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

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

  5. button高度改变

    代码:<input type="button" name="submit" value="submit" /> 利用css改变b ...

  6. 关于<button> 没写 type='button' 导致点击时提交以及<button>和<input type="button">的区别

    这是我的第一篇博客,如果写的不好,请见谅 这是一个关于button按钮一个小问题 最近刚开学跟着老师一起写代码,在模仿JAVA web程序设计(慕课版) P61页第三章 Ajax处理XML的代码中发现 ...

  7. input 和 button 的 border-box 模型和 IE8 错位

    用 input 和 button 时出现了几个奇怪的现象,先放几个 input 和 button CSS: * { margin:; padding:; } input,button { width: ...

  8. input 与 button 的问题 (空隙/不等高/对不齐)及 解决办法

    1. input 与 button 为什么有空隙? - 要明白为什么,需要了解一下几点基础知识(耐心看完,你会发现竟如此简单)     1. input 与 button 都属于行级块元素,都具有文本 ...

  9. 苹果iphone手机上input的button按钮颜色显示有问题,安卓却没问题

    苹果手机中会如类似上图,安卓却可以按自己写的来显示 解决办法: -webkit-appearance: none; 以上即可,当然样式中可以加上通用的: 通用:input[type=button], ...

随机推荐

  1. 【转载】Java开发中的23种设计模式

    转自:http://zz563143188.iteye.com/blog/1847029 一.设计模式的分类 总体来说设计模式分为三大类: 创建型模式,共五种:工厂方法模式.抽象工厂模式.单例模式.建 ...

  2. docker容器 - 新建容器、启动容器、暂停容器和停止容器

    实验环境 CentOS 7.5 容器 容器是镜像的运行实例.不同的是,镜像是静态的只读文件,而容器带有运行时需要的可写文件层:同时,容器中的应用进程处于运行状态. 新建容器 [root@kvm ~]# ...

  3. 线性筛-三合一,强大O(n)

    校内CJOJ2395by Jesse Liu 筛法三合一 Euler.Möbius.Prime函数 基于数论的积性函数 gcd(a,b)=1  则  ƒ(ab)=ƒ(a)ƒ(b) #include & ...

  4. Mongodb学习笔记(四)管理

    一.数据导出.导入 数据导入:mongoexport ./mongoimport -d 数据库 -c 集合 文件名 数据导出:mongoimport 参数说明: -d:指明使用的库,如text -c: ...

  5. P2023 [AHOI2009]维护序列 区间加乘模板

    题意: 有长为N的数列,不妨设为a1,a2,…,aN .有如下三种操作形式:N<=1e5(1)把数列中的一段数全部乘一个值;(2)把数列中的一段数全部加一个值;(3)询问数列中的一段数的和,由于 ...

  6. vue+axios安装

    Axios是一个基于promise的HTTP库,可以用在浏览器和node.js中. 安装方式: 1.使用cdn <script src="https://unpkg.com/axios ...

  7. 转载:WAV header

    转自:http://www.cnblogs.com/CoderTian/p/6657844.html WAV为微软公司(Microsoft)开发的一种声音文件格式,它符合RIFF(Resource I ...

  8. Azure IoT Hub 十分钟入门系列 (2)- 使用模拟设备发送设备到云(d2c)的消息

    本文主要分享一个案例: 10分钟- 使用Python 示例代码和SDK向IoT Hub 发送遥测消息 本文主要有如下内容: 了解C2D/D2C消息: 了解IoT Hub中Device的概念 了解并下载 ...

  9. python报错使用yum命令报错File &quot;/usr/bin/yum&quot;, line 30 except KeyboardInterrupt, e: SyntaxError: invalid syntax问题

    参考链接:https://blog.csdn.net/ltz150/article/details/77870735 1.背景: CentOS 7升级Python到3.6.2后,需要在/usr/bin ...

  10. getter和setter

    /* 对象属性是由名字.值和自足特性构成的. 属性值可以用一个或两个方法替代,这两个方法就是getter和setter. 由getter和setter定义的属性称作“存取器属性” */ /* 定义存取 ...