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

为元素设置：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. Retrofit2+Rxjava+MVP实践

    此博文根据前面两篇文章 Android MVP 架构初试 Android MVP 架构封装 再结合主流框架Retrofit2+Rxjava来个实践 源码地址RxMVP 项目截图 Retrofit2+R ...

  2. C#.NET常见问题(FAQ)-想要另存一个项目，sln文件丢了怎么办，如何打开高版本的项目

    如下图所示,我想要另存一个工程,把 V4.4整个的项目另存为V4.5,我可以把解决方案文件(.sln)改名字,但是我没法把文件夹改名字,改了打开sln就说找不到.   很简单的一个思路是反正sln是多 ...

  3. 腾讯云兑现存储获取临时授权C#版

    腾讯官方没有提供C#版的,没办法自己根据java版改写了一个,这里面的坑花了我20多个小时,所以记录下 <%@ WebHandler Language="C#" Class= ...

  4. iOS键盘高度自适应（中英文输入）

    一:添加通知监测键盘高度变化 [self keyBoardAutoSize]; 二:动态改变高度 #pragma mark keyboard height auto /* NSNotification ...

  5. strcpy sprintf memcpy 它们之间的区别

    strcpy,sprintf,memcpy的区别 strcpy 函数操作的对象是 字符串,完成 从 源字符串 到 目的字符串 的 拷贝 功能.  snprintf 函数操作的对象 不限于字符串:虽然目 ...

  6. vue 笔记二

    vue制作weibo 交互 vue-> 1.0 vue-resource ajax php 服务器环境(node) this.$http.get()/post()/jsonp() this.$h ...

  7. 【laravel5.4】迁移文件的生成、修改、删除

    建议直接去官方文档查看: https://laravel-china.org/docs/laravel/5.4/migrations#creating-columns 1.生成迁移: 主要方式:1.创 ...

  8. SVN访问版本库精细的权限控制

    SVN精细权限控制本章将详细介绍前一章所涉及的两个配置文件, svnserve.conf 和 authz.conf,通过对配置逐行的描述,来阐明其中的一些细节含义.除此之外的其他配置.安装等内容,不是 ...

  9. DP较为完整的知识

    数位DP 这类题,才刚刚接触,记得去年网络赛,就有道这样的题,我完全不会, 对于这类题基本方法是,是利用数的位数来构造转移方程. 下面给出两篇论文的链接: <数位计数问题解法研究> < ...

  10. Python的copy()与deepcopy()区别

    Python的copy()与deepcopy()分别对应浅拷贝和深拷贝. 它们的理论区别: deepcopy():深复制(也就是寻常意义上的复制),即将被复制对象完全再复制一遍作为独立的新个体单独存在 ...