解决Button在IE6、7下的自适应宽度问题
很早就遇到过这么个小问题,但由于其并未影响到实际作用和美观就没有正面解决它,现在,我们来试着解决它。
写一个Button,有两种方式:其一,直接button标签;其二,input type=”button”。
不管哪种方式,Button的宽度在IE6、7下总是不能完美,接下来我们演示一个普通的Button,你可以用IE6或者IE7浏览器看看其显示宽度,然后对比Chrome或者IE8等浏览器,你会发现Bug的所在。
1、一个普通的Button:
可以很直接的看到Button的两边有空隙,当然,这个空隙是无法用padding:0来解决的。
通常,不少同学会想到给该Button定义一个width:100px。
2、width:150px的Button:
.demo-button01{width:150px;}
3、width:auto的Button:
.demo-button02{width:auto;}
哦也,还是不行!下面试试网上提供的一种方法。
4、width:auto;overflow:visible;的Button:
.demo-button03{width:auto;overflow:visible;}
Yes,可行!还有一个方法如下:
.demo-button04{width:1;overflow:visible;}
但个人觉得width:1的写法很二,所以摒弃之。
解决Button在IE6、7下的自适应宽度问题的更多相关文章
- 漂亮的自适应宽度的多色彩CSS图片按钮
一.素材 二.效果 三.CSS *{padding:0;margin:0} /*----------------------------------- 自适应宽度图片按钮 ...
- IE6/IE7下margin-bottom失效兼容解决办法及双倍边距问题
(从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-04-08) 一.IE6/IE7下margin-bottom失效兼容解决办法 1.用padding-bottom代替:2.在 ...
- opacity在IE6~8下无效果,解决的办法
opacity在IE6~8下无效果,解决的办法 问题出现时rgba()在ie6下不出效果,最后查到是opacity的问题. opacity是css3时出现的,目前主流浏览器都支持.but老IE是个麻烦 ...
- IE6条件下的bug与常见的bug及其解决方法
1.IE6条件下有双倍的margin 解决办法:给这个浮动元素增加display:inline属性 2. 图片底部有3像素问题 解决办法:display:block;或者vertical-align: ...
- 一句white-space:nowrap解决IE6,IE7下浮动元素不自动换行
一句white-space:nowrap解决IE6,IE7下浮动元素不自动换行
- 空a标签 a标签空的情况下 IE6 IE7下点击无效
最近做了好多网站专题页面,因为专题页面图片较多,个别banner上有1个到多个按钮,一种是用“图解img标签的usemap”的方法做链接,(图解img标签的usemap使用方法)[传送门] 另一种用则 ...
- IE6 7下常见CSS兼容性处理
以下是一些比较常见的IE6 7下的兼容性问题. 在当下这个时代,其实我们几乎可以不用再去针对IE6做兼容性的处理,除非你的公司还是诡异的要求你兼容到IE6.但是了解一些常见的兼容性问题还是可以帮助我们 ...
- ie6,7下js动态加载图片不显示错误
ie6,7下js动态加载图片不显示错误 先描述一下出现这种匪夷所思bug的背景: 我在页面加载的时候加载一堆小缩略图,<a href="javascript:void(0);" ...
- ie6,7下的textarea的type获取
<input type='button' value="按钮" class='gys'> <textarea class='gys gystextarea'> ...
随机推荐
- mysql 取得行号后再排序
一.理论准备 Map是键值对的集合接口,它的实现类主要包括:HashMap,TreeMap,Hashtable以及LinkedHashMap等. TreeMap:基于红黑树(Red-Black tre ...
- python学习笔记:python字符串
二.python字符串操作符 1. 对象标准类型操作符 Python对象的标准类型操作符一共就三种:对象值的比较.对象身份的比较.布尔类型.其中对象值的比较主要是大于.小于.不等于等的数学比较符:对象 ...
- mysql用root用户启动后其他用户无法启动不问题
问题描述:用root账户启动mysql后,在用mysql用户或其他非root账户启动不了mysql问题解决:通过看mysql的err日志,发现 Failed to open log (robert-b ...
- TensorFlow 深度学习笔记 Stochastic Optimization
Stochastic Optimization 转载请注明作者:梦里风林 Github工程地址:https://github.com/ahangchen/GDLnotes 欢迎star,有问题可以到I ...
- 一封推荐信——android培训机构
我,男,23岁,即将毕业的大四学生,就读于天津一所二本院校,计算机科学与技术专业.大一期间,进入新校园,和同学到各个宿舍推销陶瓷杯,国美电器饮水机促销员,组团蹬车游市区,不断地去探索.尝试,追求内心向 ...
- Silence.js高效开发移动Web前端类库
基于Zepto的轻量级移动Web前端JavaScript类库. 编写这个类库原因及目的: 采用MVC设计模式,使代码工程化结构化. 使用RouterJS,提升前端交互性能,延长页面使用时间,并通过Aj ...
- Adding Pagination 添加分页
本文来自: http://www.bbsmvc.com/MVC3Framework/thread-206-1-1.html You can see from Figure 7-16 that all ...
- IOS开发之——获取屏幕的尺寸及各模拟器代表的型号
获取屏幕尺寸 [[[UIScreen mainScreen] currentMode].size.width]; [[[UIScreen mainScreen] currentMode].size.h ...
- linux中grep使用方法具体解释
查找特定字符串并颜色显示 [root@fwq test]# grep -n 'the' regular_express.txt --color=auto 8:I can't finish the te ...
- 链接脚本之LMA VMA解释
链接脚本中的LMA和VMA是什么意思.这个问题纠结了一段时间,今天在看<ARM体系结构与编程>时,豁然开朗,写下自己的认识.分享例如以下: LMA:载入地址 位于存储器中的地址 LOAD ...