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

为元素设置：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. 在Foreda8中整合Apche httpd2.4.6和Tomcat7.0.42（使用tomcat-connectors-1.2.37）

    本地Apche httpd2.4.6(http://pan.baidu.com/share/link?shareid=4003375081&uk=34256769)和Tomcat7.0.42是 ...

  2. VM虚拟机安装之后出现无法自动登录到桌面以及__vmware_user__怎么办

    1 运行control userpasswords2 打开用户账户对话框,点击高级选项中的"高级"按钮 2 右击" __vmware_user__"这个账户,选 ...

  3. oracle最大连接数相关

    1.连接数据库 sqlplus / as sysdba 2.查看当前数据库连接数 select count(*) fromv$process; 3.查看当前数据库允许的最大连接数 select val ...

  4. uni - 条件渲染

    vue官方文档和uni官方同步:https://cn.vuejs.org/v2/guide/conditional.html 1.多次切换建议使用v-show(始终保存在BOM) 2.因为if是惰性判 ...

  5. Java从零开始学三十九(对象序列化)

    一.序列化 将对象的状态存储到特定存储介质中的过程 对象序列化,就是把一个对象变为二进制的数据流的一种方法,通过对象序列化可以方便的实现对象的传输或存储.   序列化保存对象的“全景图”,构建对象的“ ...

  6. window下redis nosql初试

    1:redis官方下载地址http://redis.io/download   下载下来,有32位的,有64位的,自己选择. 2:将redis文件夹放到D盘:D:\redis watermark/2/ ...

  7. Navicat如何直接修改表中数据？

    Navicat如何直接修改表中数据?

  8. chrome插件的popup与跨域请求

    chrome插件的popup与跨域请求 tkorays <tkorays@hotmail.com> popup及其它js脚本         在chrome插件开发中,大致有几种类型的js ...

  9. 2014年，daliu_it 年末文章汇总清单

    一.javabase 1. Windows环境下JDK安装与环境变量配置 详细的介绍了JDK的安装以及配图,同时安装的注意事项. 2. 项目的命名规范,为以后的程序开发中养成良好的行为习惯 详细的介绍 ...

  10. Drupal的$messages是怎么显示的？

    Drupal的默认主题bartik会在页面顶部显示系统信息,例如警告.状态等.这个过程是如何实现的? 首先,在bartik目录下找到page.tpl.php,这是bartik主题的页面显示模板.其中有 ...