css高手,好奇怪啊为什么就是有空隙 _HTML/CSS

求助css高手,好奇怪啊,为什么就是有空隙

CSS code

<style type="text/css">
*{
margin:0px;
padding:0px;
}
#bar{
width:10px;
float:left;
height:100%;
text-align: center;
border-right:1px solid #125695;
}
#right{
margin-right:5px;
border:1px solid #125695;
height:100%;
}

#bar img{
 cursor:pointer;    
}
</style>
<body>
<div id="bar">甲层</div>
<div id="right">乙层<br>甲和乙为什么会有空隙啊
</div>
</body>

代码如上ff下是好的,但是ie里bar的div和right的div之间总是有那么些空隙,如何消除啊?

------解决方案--------------------
marginLeft设了负数也不行，用相对定位吧，虽然感觉不太好，但能实现就行了。

HTML code

<style type="text/css">
*{
margin:0px;
padding:0px;
}
#bar{
float:left;
width:10px;
height:100%;
text-align: center;
border-right:1px solid #125695;
}
#right{
position:relative;
left:-3px;
margin-right:5px;
border:1px solid #125695;
height:100%;
}

#bar img{
 cursor:pointer;    
}
</style>
<body>
<div id="bar">甲层</div>
<div id="right">乙层<br>甲和乙为什么会有空隙啊</div>
</body>