• 2010年03月12日
Position: IT杂志   \ 博客建设   \ POST CONTENT:

文章分类:博客建设

总结使用DIV+CSS布局时常见的BUG

作者:网络 发表于:2008-09-24   点击: 523 views

转载yofox的做主题和修改主题又很大帮助,转载慢慢消化原文链接:http://www.yofox.net/2008/09/bug-ie-ff/

1.ul在FF中默认是有padding值的,而在IE中只有margin值.
   解决方法:ul{margin:0; padding:0;}

 

2.margin加倍的问题:
   BUG出现在IE6中,当使用margin时,会出现双倍距离,例如margin-left:5px;在IE中可能会被解析为margin-left:10px;
   解决方法:在margin-left:5px;后加上display:inline;

 

3.高度不能自适应问题:
   当包含float的box的时候,高度自动适应会无效。这时在包含的容易上加上:overflow:hidden;即可解决IE7,FF自适应。
   如果要让IE6也达到预期效果,需要在加上: { zoom:1;}或者{ height:100%;}
   解决方法:{ overflow:hidden; height:100%;} 或者 { overflow:hidden; zoom:1;}

 

4.IE中奇怪的左右border断线现象
  如果容器内有两个浮动,并用CLEAR清除浮动。在ie下拖动滚动条时最外层的border会消失,如果给最外层加上宽度或者高度就不会出现。
  3种解决方法:
  在父元素中加入height:1%;
  加入一个宽度;
  加入一个背景色.

 

5.IE下容器高度小于10px,容器高度会默认加到line-height的高度
  解决方法:font-size:0;

 

6.当<li><a herf=”#”><img src=”#”></a></li>出现时,<img>会默认有一个向下的padding值;
  解决方法:li {font-size:0;}

 

7.IE6下不兼容PNG透明背景问题.
  FF以及IE7都可以对PNG透明背景有很好的支持,但是在IE6下却不行,下面给出解决方法:
  background:url(images/footer_bg.png) no-repeat;
 *background-image: none;
 *filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, src=images/footer_bg.png, sizingMethod=scale);
 注意:如果遇到无效的情况,src=images/footer_bg.png改为绝对地址。

 

8.使用透明PNG背景出现链接失效
解决方法:加上position:relative;

相关文章

相关文章

赶快留言冒泡

  • 评论 (0)
  • 引用通告 (0)
目前还没有任何评论.
目前还没有任何Trackbacks和Pingbacks.
吐个泡浮上去.
订阅本站内容

RSS Feed Subscribe me via Rss Feed. Choose a Reader: 鲜果, Google Reader, 抓虾, 有道, or E-mail...