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

为元素设置: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. 分享几套古典复古式的UI设计

    古典复古的UI界面设计能够非常好的点缀你的网页,特别是如果你需要展示你的产品或者内容的深度内涵或者体验你的内容或者产品的经久不衰的气质的 话,古典或者复古式的界面UI绝对是你首选,在这里我们收集了10 ...

  2. 页面载入时通过获取GridView某行某列的值来控制某一列的控件属性

    通过获取状态来控制"查看"button的Visible属性值. 在前台GridView中加入 OnRowDataBound="GridView1_RowDataBound ...

  3. C和C++静态检查规范

  4. 很不错标签云js插件

    在蓝色看到有需要标签云的球形效果,我记得之前在网上见到过,印象比较深刻,就找出地址发给他了,接下来却还有人需要这个效果的JQuery插件,网上好像也有,但是我看现在这个就不错,就想想自己改成jquer ...

  5. 包装类、object、单例模式、final、抽象类

    /*包装类*/ /*  byte   Byte  short   Short  int    Integer  long   Long  char   Character  float   Float ...

  6. CSS3 GPU硬件加速

    1.代码(未添加GPU加速代码) <!DOCTYPE html> <html lang="zh-CN"> <head> <meta cha ...

  7. 第14章1节《MonkeyRunner源代码剖析》 HierarchyViewer实现原理-面向控件编程VS面向坐标编程

    到此为止我们描写叙述的MonkeyRunner相应用的点击拖放等操作都是直接通过指定坐标点来实现的.比方以下触摸一个坐标点为(60,90)的按钮的脚本样例: 1 device.touch(60,900 ...

  8. 位图算法 C语言

    #include <stdio.h> void set_bit(void *base, unsigned long n) { unsigned long *m = (unsigned lo ...

  9. oracle 批量更新之update case when then

      oracle 批量更新之update case when then CreationTime--2018年8月7日15点51分 Author:Marydon 1.情景描述 根据表中同一字段不同情况 ...

  10. JDBC实例--通过连接工具类DBUtil +配置文件来获取连接数据库,方便又快捷

    根据前面的连接方法,还有缺点就是,如果人家要换数据库,还得改动源代码,然后还要编译什么的.这样客户修改也不容易. 做法:我们写一个配置文件,把该数据写在配置文件上面,然后通过类来加载改文件,然后读取相 ...