Button在IE6、7下的自融入宽度难题处理方式

2021-03-12 01:25 jianzhan

写1个Button,有两种方法:其1,立即button标识;其2,input type=”button”。

无论哪样方法,Button的宽度在IE6、7下一直不可以完善,接下来大家演试1个一般的Button,你能够用IE6或IE7访问器看看其显示信息宽度,随后比照Chrome或IE8等访问器,你会发现Bug的所属。

1、1个一般的Button:

能够很立即的看到Button的两侧有时间隙,自然,这个间隙是没法用padding:0来处理的。

一般,很多同学会想起给该Button界定1个width:100px。

2、width:150px的Button:

.demo-button01{width:150px;}

恭贺,你是对的。可是,大家务必这个Button自融入宽度呢?

好吧,加个width:auto试试。

3、width:auto的Button:

.demo-button02{width:auto;}

哦也,還是不好!下招聘面试试在网上出示的1种方式。

4、width:auto;overflow:visible;的Button:

.demo-button03{width:auto;overflow:visible;}

Yes,可行!也有1个方式以下:

.demo-button04{width:1;overflow:visible;}

但本人感觉width:1的写法很2,因此革除之。

结语:

假如你要问问甚么IE6、7下会出現这样的难题,我说是微软很2。处理Button自融入宽度的最好方法是width:auto;overflow:visible;

参照材料:http://jehiah.cz/a/button-width-in-ie