【IE6的疯狂之三】IE6 3像素BUG的实例
日期:2013-12-16 来源:攀枝花惠康网络公司
问题:2列结构。左列固定,右列液态
我需要做一个结构。
2列,左边列固定宽度。右边列使用残剩宽度。整体宽度不固定,这样不管在17 仍是19的屏幕上,左边列始终宽度不变,右边列宽度始终占有残剩宽度。
可是我写这个结构缺在ie6下面始终解决不了3像素bug。
请在IE6下测试
<!– saved from url=(0027)<a href=http://www.css88.com/archives/”http://www.chen-jing.cn/12/” target=”_blank” rel=”external”>http://www.chen-jing.cn/12/</a> –>
<HTML xmlns=”<a href=http://www.css88.com/archives/”http://www.w3.org/1999/xhtml” target=”_blank” rel=”external”>http://www.w3.org/1999/xhtml</a>”><HEAD><TITLE>关于3像素bug的延生</TITLE>
<META http-equiv=Content-Type content=”text/html; charset=gb2312″>
<STYLE type=text/css>BODY {
FONT-SIZE: 12px
<BODY>
}
.a1 {
.a2 {
BACKGROUND: #333; FLOAT: left; WIDTH: 100px; COLOR: #ffffff; HEIGHT: 240px
}
}
BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; MARGIN-LEFT: 100px; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 1px solid
}
style=”COLOR: #ffff00″ onClick=”this.parentNode.style.height=’150px’”
.a2 #jing {
<DIV
.a2 #jing2 {
<META content=”MSHTML 6.00.6000.16587″ name=GENERATOR></HEAD>
BACKGROUND: #ff9900; HEIGHT: 100px
BACKGROUND: #00ccff; MARGIN-LEFT: -3px; HEIGHT: 100px
}
<DIV class=a1>我是class=a1 <BR><A style=”COLOR: #ffff00″
onclick=”this.parentNode.style.height=’100px’”
href=http://www.css88.com/archives/”<a href=”http://www.chen-jing.cn/12/” target=”_blank” rel=”external”>http://www.chen-jing.cn/12/</a>#”>点击设置a1的高度为100</A><BR><A
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “<a href=http://www.css88.com/archives/”http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd” target=”_blank” rel=”external”>http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd</a>”>
href=http://www.css88.com/archives/”<a href=”http://www.chen-jing.cn/12/” target=”_blank” rel=”external”>http://www.chen-jing.cn/12/</a>#”>点击设置a1的高度为150</A></DIV>
<DIV class=a2>
id=jing>我是id=jing<BR>这个问题存在于IE6琅缦沔。ie7,opera,ff都没问题。不雅察看class=a2的div所设置的边框会发现,a2和a1之间是没有距离的。可是a2
</STYLE>
琅缦沔元素(文本)会和a2之间发生近似padding-left:3px;的效不美观。操作以往的设置负值,也没法子消弭第一个元素id=jing和a2的距离。更有意思的是当我设置了_margin-left:-3px;原本id=jing和a2
之间的3像素距离酿成了2像素。可是实时我_margin-left 的负值设置得再年夜,不能完全消弭</DIV>
<DIV id=jing2>我是id=jing2<BR>当a1的高度年夜于id=jing这个元素的高度的时辰,di=jing2
就不会和a2之间有间距。<BR>原本我只是想做一个左列固定,右列自动顺应残剩宽度的结构。可是没想到发现了这个问题。求某位高手告诉我怎么解决。
也会发生和a2之间近似padding-left:3px的间距。 当a1 小于或者等于id=jing的时辰,id=jing2
</DIV></DIV></BODY></HTML>
文章来源:攀枝花惠康网络公司
惠康网络,是一家专业从事攀枝花网站建设,攀枝花网站制作,攀枝花网站设计公司,提供网站建设一条龙服务(网站域名注册+网站服务器租用+网站开发+网站维护+网站营销推广),惠康网络立足攀枝花,辐射全中国,攀枝花惠康网络的客户已经遍布国内各地大中小城市,我们高效优质的网站建设服务深受用户好评。