我有一个带有两个图像的精灵，顶部和底部的圆形边框用于某些功能框。一些HTML示例：
<div class="box">
<div class="top"></div>
<div class="middle">Content Here</div>
<div class="bottom"></div>
</div>
CSS：
.box {float:left;width:400px;}
.top,.bottom {float:left;width:400px;height:4px;background-image:url(/images/boxborders.gif);}
.bottom {background-position: 0 -4px;}
.middle {float:left;width:398px;border-left:1px solid #333333;border-right:1px solid #333333;}
在FF 3和4中，Chrome，IE 7,8和9显示它应该显示，.top和.bottom div“拥抱”中间div以创建一个盒子效果。
然而，在IE6中，.top div显示整个背景图像并且似乎以某种方式增加了它的高度，即使开发人员工具栏告诉我高度是4px，它显然不是因为它显示整个8px然后，在中间div开始之前，图像的空白区域大致相同。
以前有人经历过这个吗？任何反馈意见
由于