border-collapse: collapse在FireFox,IE6,IE7下的小bug
日期:2013-11-26 来源:攀枝花惠康网络公司
一向使用border-collapse: collapse来做1像素边框的表格,好比:
table{border-collapse:collapse;border: 1px solid #FFFFFF;} table td,table th{border: 1px solid #FFFFFF;}
昨天css森林的飘发了一篇文章(http://www.charlesgarwood.com/blog/?p=13)才发现原本border-collapse: collapse在FireFox下有个小bug。
table{border-top: none;border-right:none;border-bottom: 1px solid #FFFFFF;border-left: 1px solid #FFFFFF;} table td,table th{border-top:1px solid #FFFFFF;border-right: 1px solid #FFFFFF;border-bottom:none;border-left: 0;}
ie8,CH,OP,SF都没侍趵硎题,而在FF下饶暌怪一个小BUG:table的左边会多出1个像素的边框,而且在ie7和ie6下单元格宽度没有等分,第一个比其他几个要小一点,如图:
飘发的文章虽然有解决方案,可是小我使命太麻烦了,还不如我下面这个解决方案,没有hack或者前提注释,而且解决了膳缦沔的2个问题:
点此查看我做的demo:http://www.css88.com/demo/border-collapse/border-collapse.html
文章来源:攀枝花惠康网络公司
惠康网络,是一家专业从事攀枝花网站建设,攀枝花网站制作,攀枝花网站设计公司,提供网站建设一条龙服务(网站域名注册+网站服务器租用+网站开发+网站维护+网站营销推广),惠康网络立足攀枝花,辐射全中国,攀枝花惠康网络的客户已经遍布国内各地大中小城市,我们高效优质的网站建设服务深受用户好评。