今天终于明白为什么表单元素的宽度经常对不齐了，原来是计算的问题。

为元素设置：box-sizing: border-box;，则表明width的宽度为内容本身宽度+padding+border（高度一样）
为元素设置：box-sizing: content-box;，（默认就是这个），则表明width的宽度就是内容本身的宽度，padding以外的再另算。

而input、select默认的样式是不同的，所以就造成了width设置的一样，但就是对不齐。全部设成border-box就省事了。
（IE8及以上版本支持。）

具体请查看文章：http://www.w3cplus.com/content/css3-box-sizing

html input select等控件宽度对不齐？请使用box-sizing。的更多相关文章

  1. input的file 控件及美化

    在一些网站进行上传时,当单击了“浏览”按钮之后会弹出[选择文件]的对话框.想要实现这一功能,用input的file控件来实现就好啦~ <!doctype html> <html la ...

  2. input绑定datapicker控件后input再绑定blur或者mouseout等问题

    input绑定datapicker控件后input再绑定blur或者mouseout等问题 问题描述:今天在修改一个东西的时候需要给一个input输入域绑定blur事件,从而当它失去焦点后动态修改其中 ...

  3. Android单个控件占父控件宽度一半且水平居中

    前些天,在工作中遇到了一个需求:一个“加载上一页”的按钮宽度为父控件宽度一半,且水平居中于父控件中. 在此给出两种思路: 1.直接在Activity代码中获取到当前父控件的宽度,并将此按钮宽度值设置成 ...

  4. 页面加载完成触发input[type="file"]控件问题

    由于浏览器厂家的限制,不同的浏览器不开放页面加载完成就允许触发input[type="file"]控件 测试 Chrome .火狐 .IE .微信客户端QQ =>桌面端: C ...

  5. input file HTML控件控制

    网页上添加一个input file HTML控件: 1 <input id="File1" type="file" /> 默认是这样的,所有文件类型 ...

  6. ComboBox控件绑定数据源后,添加'请选择'或'全部'

    ComboBox控件绑定数据源后,添加'请选择'或'全部' 当使用ComboBox控件绑定数据源之后,通过Items 属性添加的数据是无效的,此时如果要在所有选项前添加 选项 ,则需要考虑从数据源下手 ...

  7. MFC编程入门之二十二（常用控件：按钮控件Button、Radio Button和Check Box）

    本节继续讲解常用控件--按钮控件的使用. 按钮控件简介 按钮控件包括命令按钮(Button).单选按钮(Radio Button)和复选框(Check Box)等.命令按钮就是我们前面多次提到的侠义的 ...

  8. VS2010/MFC编程入门之二十二（常用控件：按钮控件Button、Radio Button和Check Box）

    言归正传,鸡啄米上一节中讲了编辑框的用法,本节继续讲解常用控件--按钮控件的使用. 按钮控件简介 按钮控件包括命令按钮(Button).单选按钮(Radio Button)和复选框(Check Box ...

  9. VS2010-MFC（常用控件：按钮控件Button、Radio Button和Check Box）

    转自:http://www.jizhuomi.com/software/182.html 按钮控件简介 按钮控件包括命令按钮(Button).单选按钮(Radio Button)和复选框(Check ...

随机推荐

  1. javascript深度克隆对象

    /** * * @param obj * @returns {*} */ //深度克隆 function cloneObject(obj) { if (obj === null || typeof(o ...

  2. linux下线程调试 ulimit core

    在linux 下写线程程序的同学预计都遇到过找bug找到崩溃的情况.多线程情况下bug的追踪实在是不easy. 如今我来介绍一个好用的方法 ulimit core. 先简介一下ulimit是个什么(你 ...

  3. STL与多线程+写时拷贝

    http://blog.csdn.net/liuxuejiang158blog/article/details/13251379 STL并不是线程安全的,当多个线程同时读取STL时没什么问题.当多个线 ...

  4. uni-app 如何引入全局方法或变量?

    利用Vue.prototype挂载到Vue实例上即可

  5. D. Flowers Codeforces Round #271(div2)

    D. Flowers time limit per test 1.5 seconds memory limit per test 256 megabytes input standard input ...

  6. &quot;高可用方案工具包&quot; high availability toolkit 1.2 公布了。version 1.2 新增了 负载均衡 load balance 的技术实现

    "高可用方案工具包"  high availability toolkit 1.2 公布了. version 1.2 新增了 负载均衡 load balance 的技术实现. 项目 ...

  7. TOMCAT问题总结

      迁移时间--2017年7月9日14:58:12Author:Marydon CreateTime--2016年12月25日21:55:09Author:MarydonTomcat问题总结问题一 A ...

  8. [Done]Spring @Pointcut 切点调用不到（SpringAOP嵌套方法不起作用） 注意事项

    今天在开发过程中,遇到一个问题卡了很久,测试代码如下: package spring.pointcut; import org.aspectj.lang.ProceedingJoinPoint; im ...

  9. DIV+CSS布局重新学习之使用A标签和CSS制作按钮

    这里主要利用A元素的伪类来实现: a:link {color: #FF0000} /* 未访问的链接 */ a:visited {color: #00FF00} /* 已访问的链接 */ a:hove ...

  10. servlet 服务器HTTP响应头设置示例(response用法）

    1,Location 用于重定向,和返回状态码302结合使用. 代码示例: response.setStatus(302); response.setHeader("location&quo ...