DIV+CSS 常见问题及解决办法整理
【IE6】浮动双倍边距bug：
问题 ：同时使用“float”和“margin”，则margin在IE6下实际显示为双倍。
解决：给浮动容器定义display:inline
【IE6】width和height值 = 最小值
问题：IE6不认min-height，但hight=min-height。若只设定min-height，IE6下等于没有高度；若只设定高度，IE6会自动将内容撑大。标准浏览器中固定高度值的容器是不会象IE6里那样被撑开的。
解决：
height: auto!important; /*使其他浏览器高度自适应*/
height: 100px; /*针对IE6 最小高度*/
min-height: 100px; /*针对其他浏览器最小高度*/
【IE6】为什么无法定义1px左右高度的容器？
问题：这是因为默认的行高造成的
解决：(选择一种)
①、overflow:hidden;
②、zoom:0.08;
③、line-height:1px;
【IE6】mirror margin bug
问题：当外层元素内有float元素时，外层元素如定义margin-top:14px，将自动生成margin-bottom:14px。 padding也会出现类似问题
解决：外层元素设定border 或 设定float。
【IE6】浮动外层宽度问题
问题：float元素如没定义宽度，内部如有div定义了height或zoom:1，这个div就会占满一整行，即使你给了宽度。
解决：float元素如果作为布局用或复杂的容器，都要给个宽度。
【IE7、FF】高度不能自适应
问题：父层div不能自适应子层div的高
原因：子层设置了浮动，而父层没有浮动
解决：（按实际情况选择一种）
①、设置父层div浮动
②、取消子层div浮动
③、在横向浮动的多个子对象后加一个空div，并 设置clear:both;
④、为父层设置：{overflow: auto; _height:1%;} 前者针对FF、IE7；后者针对IE6
【IE7、FF】横向上的撑破容器问题
问题：如果float 容器未定义宽度，ff下内容会尽可能撑开容器宽度，ie下则会优先考虑内容折行。
解决：内容可能撑破的浮动容器需要定义width。
【All】文字本身的大小不兼容
问题：同样是font-size:14px的宋体文字，在不同浏览器下占的空间是不一样的。
ie下实际占高16px，下留白3px；ff 下实际占高17px，上留白1px，下留白3px；opera下就更不一样了。
解决：
给文字设定 line-height 。确保所有文字都有默认的 line-height 值。这点很重要，在高度上我们不能容忍1px 的差异。
【All】clear层应该单独使用
问题：也许你为了节省代码把clear属性直接放到下面的一个内容层，这样有问题，不仅仅是ff和op下失去margin效果，ie下某些margin值也会失效
解决：<div class=”clear”></div>放在需要清除浮动的层后面
【All】怎样才能让层显示在flash上呢？
解决：<param name=”wmode” value=”transparent” />
【All】怎样使一个层垂直居中于浏览器中？
解决：
<style type=”text/css”>
<!–
div {
position:absolute;
top:50%;
left:50%;
margin:-100px 0 0 -100px;
width:200px;
height:200px;
border:1px solid red;
}
–>
</style>
【All】单像素外框线表格
解决：
table{ border-collapse:collapse; }
td{ border:#000 solid 1px; }
后续……
评论