986.IE中的BUG之margin-bottom失效
1. 出现条件
元素被浮动, 且其后没有其他元素,元素的margin-bottom不为0或auto.
2. 症状
为元素指定的margin-bottom无效, 就像margin-bottom为0一样.
3. 受影响的浏览器
IE6, IE7
4. 原因
暂不知道
5. 解决方法
a. 取消元素的margin-bottom, 改为指定父元素的padding-bottom(推荐);
b. 在元素之后添加一个<br />, 为其指定如下样式(不推荐, 放在此处, 了解一下):
elem{clear:both;}
6. example
/* 使用是第1种方法 */ xhtml: <div id="box"> <p>example 1</p> <p>example 2</p> </div> css: #box {width: 210px;overflow: hidden;border: 1px solid green;margin: 10px auto 0;padding-bottom:10px;} #box p {display: inline; float: left;width: 50px;border: 1px solid red;margin: 10px 5px 0;} /* 使用是第2种方法 */ xhtml: <div id="box"> <p>example 1</p> <p>example 2</p> <br /> </div> #box {width: 210px;overflow: hidden;border: 1px solid green;margin: 10px auto 0;} #box p {display: inline; float: left;width: 50px;border: 1px solid red;margin: 10px 5px;}? #box br {clear:both;}