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

为元素设置: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. STL - Map - 运行期自定义排序

    RuntimeStringCmp.cpp #include <string> using namespace std; // function object to compare stri ...

  2. 代理(Proxy)模式简介

    一.代理(Proxy)模式简介 代理模式是结构型模式. 代理模式给某一个对象提供一个代理对象,并由代理对象控制对原对象的引用. 代理对象要继承于抽象主题,并控制原对象的引用 二.简单例子 抽象主题类 ...

  3. 圆形Camera预览实现

    需求 最近有个需求要求界面上使用圆形相机预览进行面部检测 , 具体需求如下图 关于Camera之前接触得比较多 , 主要就是通过SurfaceView显示预览视图 , 因此需要展示圆形预览界面, 只需 ...

  4. java两种同步机制的实现 synchronized和reentrantlock

    java两种同步机制的实现 synchronized和reentrantlock 双11加保障过去一周,趁现在有空,写一点硬货,因为在进入阿里之后工作域的原因之前很多java知识点很少用,所以记录一下 ...

  5. 学习KNN

    转:© 著作权归作者所有 by ido 什么是KNN算法呢?顾名思义,就是K-Nearest neighbors Algorithms的简称.我们可能都知道最近邻算法,它就是KNN算法在k=1时的特例 ...

  6. Oracle执行SQL报错ORA-00922

    问题描述: 对Oracle数据库执行序列化脚本出错,ora-00922 missing or invalid option  #无效的选项 问题解决: 对于set define off --这个是sq ...

  7. url-pattern配置

    <url-pattern>/a</url-pattern> <url-pattern>/ff.do</url-pattern> <url-patt ...

  8. 【转载】CodeLite汉化

    这几天在Ubuntu下做程序想找一个代码提示功能比较好的IDE但又不想用NETBEANS和ECLIPSE,找到CodeLite但是它是全英文的,比较晕.找了一下,下载了一个windows版的准备回去研 ...

  9. delphi實現按键精靈的功能

    unit kbKernel; interfaceuses  Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Fo ...

  10. Java中的资源文件加载方式

    文件加载方式有两种: 使用文件系统自带的路径机制,一个应用程序只能有一个当前目录,但可以有Path变量来访问多个目录 使用ClassPath路径机制,类路径跟Path全局变量一样也是有多个值 在Jav ...