盒模型bug的解决方法

2024-05-14 23:37:25

盒模型bug的解决方法

我们定义一个最基本的层：

boxtest

div.boxtest{
border:20px   solid #60A179;
padding: 30px;
background :  #ffc;
width : 300px;
}

标准情况下，这个盒的宽度是:20+30+300+30+20=400px。

但是在IE5.0浏览器中，对盒模型的宽度解释有个bug，它认为300 px是整个盒的总宽度，内容的宽度变成：300-20-30-20-30=200px。

为了弥补这个bug，采用一个技巧：即增加一个IE5不能解释的声音属性"voice-family",读到这个定义时浏览器就不再继续阅读，认为宽就是400px，但而其他符合标准的浏览器会继续阅读，并执行第二个真实值300px。

content

div.content{
border:20px solid #60A179;;
padding:30px;
background: #ffc;
width :400px;
voice-family :   "\"}\"";
voice-family :inherit;
width :  300px;
}

同样，在Opera7.0以前的浏览器也有这样的解析bug。但我们并不需要使用伪值，有更简单的办法解决这个问题：
html>body .content { width :300px; }

From:http://www.w3cn.org/article/tips/2004/90.html

posted on 2008-07-07 11:33 Shicai Yang 阅读(...) 评论(...) 编辑收藏

转载于:https://www.cnblogs.com/youth0826/archive/2008/07/07/1237368.html

盒模型bug的解决方法相关推荐

浅谈Android Fragment嵌套使用存在的一些BUG以及解决方法
自从Android3.0引入了Fragment之后,使用Activity去嵌套一些Fragment的做法也变得更加流行,这确实是Fragment带来的一些优点,比如说:Fragment可以使你能够将a ...
js中hover事件时候的BUG以及解决方法
js中hover事件时候的BUG以及解决方法参考文章: (1)js中hover事件时候的BUG以及解决方法 (2)https://www.cnblogs.com/mmykdbc/p/7464050. ...
[css] 写出你遇到过IE6/7/8/9的BUG及解决方法
[css] 写出你遇到过IE6/7/8/9的BUG及解决方法把以前兼容IE6.7学习的东西搬出来了,还以为不见了.兼容性问题 1.IE6margin双边距问题 2.IE67 li间隙问题 3.图片间 ...
php is_subclass_of,PHP_PHP is_subclass_of函数的一个BUG和解决方法，is_subclass_of的作用：复制代码 - phpStudy...
PHP is_subclass_of函数的一个BUG和解决方法 is_subclass_of的作用: bool is_subclass_of ( object object, string class ...
Linux x86主机运行天数是是24.8的倍数都有可能引发oracle bug及解决方法
问题是因后台无法登录发现该BUG的,连PLSQL及服务器上的oracle DBA也无法登录oracle 查看系统相关资源: 负载高,系统层的CPU使用高, 解决方法: 重启服务器,问题解决通过查找原 ...
whitelabel error page怎么解决_pyppeteer使用遇到的bug及解决方法
pyppeteer的问题本身这个项目是非官方的,是基于谷歌官方puppeteer的python版本. 本来chrome就问题多多,puppeteer也是各种坑,加上pyppeteer是前两者的pyt ...
oracle 整倍数,Linux x86主机运行天数是24.8的倍数都有可能引发Oracle bug及解决方法...
问题是因后台无法登录发现该BUG的,连PLSQL及服务器上的Oracle DBA也无法登录oracle 查看系统相关资源: 负载高,系统层的CPU使用高, 解决方法: 重启服务器,问题解决通过查找原 ...
关于深澜校园网与Windows系统之间存在的bug及解决方法
关于深澜校园网与Windows系统之间存在的bug及解决方法问题描述大多数装了深澜校园网客户端的Windows8或者win10 1809及以后版本系统用户在一次重启电脑或者普通开机之后,发现深澜拨 ...
魔兽世界8.0服务器不稳定老掉线,魔兽世界8.0升级常见BUG及解决方法介绍
魔兽世界8.0升级常见BUG及解决方法介绍 2018-08-15 09:36:56来源:游戏下载编辑:苦力趴评论(0) <魔兽世界>8.0版本"争霸艾泽拉斯"已经在今日 ...
多元线性回归的缺陷_多元线性回归模型常见问题及解决方法概要.ppt
多元线性回归模型常见问题及解决方法概要多元线性回归模型基本假设 (1)随机扰动项ui数学期望(均值)为零.E(ui)=0 (2)随机扰动项ui的同方差性且无自相关Var(ui)=σ2 (3)解释变 ...

最新文章

热门文章