我是左侧栏:定义左侧FLOAT: left 我是右侧栏:定义右侧FLOAT:right
IE6、7下由于font-size引起的尺寸问题,css怎么解决?
题主 接代码:
<style>
.wrap{width: 800px;height: 600px;background: red;font-size: 0px;}
.a{display:inline-block;*display:inline;zoom:1;width: 600px;height: 300px;background: blue;font-size: 16px;}
.b{display:inline-block;*display:inline;zoom:1;width: 200px;height: 300px;background: green;font-size: 16px;}
</style>
<div class="wrap">
<div class="a"></div>
<div class="b"></div>
</div>
问题是IE6和7不认识 inline-block
不是你说的字体大小问题。
设置字体只是因为换行元素在浏览器下会产生3px的间距 跟IE6 7无关2013-04-19
<body> <div id="main" style="background:red;width:600px;height:650px;font一size:0;"> <div id="left" style="background:green;FLOAT: left;width:400px;height:300px;display:inline一block; font一size:l6px;"> 我是左侧栏:定义左侧FLOAT: left </div> <div id="right" style="background:blue;FLOAT: right; width:200px; height:300px;display:inline一block; font一size:l6px;"> 我是右侧栏:定义右侧FLOAT:right </div> </div></body> 试试
看
2013-04-19
同级div默认是宽度最大化、高度最小化、自动换行的;而你用float能解决是因为div加了float后就变为宽度最小化、高度最小化、顶满父级宽度后再换行;
至于你说的回车、换行导致尺寸变化?那应该不是字体的原因造成的,可能是你设置了其他的样式后因为不同浏览器对该样式的解析不一样造成的问题,通常情况下比较容易出错的就是样式是boder、margin和padding;当然不止这几个,这3个因为用的比较多所以出错概率也比较大;
我百度空间有关于浏览器兼容方便的文章,有需要的话你就看看2013-04-19
IE6、7不支持display:inline-block ,你可宽度稍微设小点,有将近3px的距离,你可以试试2013-04-19