如何从IE中的堆叠DIV中删除空格？

Question

我有两个DIV堆叠在彼此顶部并被第三个DIV包围。然后在堆叠的DIV下面我有一个“红色”DIV。

在Chrome中，DIV正确显示。在IE6和IE7中，堆叠的DIV和红色DIV之间有一个空格。

<style>
div.imgbox {
    position:relative;
    top:0;
    left:0;
    bottom:0;
    right:0;
    width:103px;
    height:58px;
}

div.imgthumb {
    position:relative;
    background:#000000;
    z-index:3;
    width:103px;
    height:58px;
}

div.imgplay {
    position:relative;
    top:-58;
    color:red;
    z-index:4;
}

div.imgplay a {
    width:103px;
    height:58px;
    display:block;
}

div.imgplay img {
    width:25px;
    height:25px;
}
</style>

<div class="imgbox">
<div class="imgthumb"></div>
<div class="imgplay"><a href="#"><img src="http://freetvpower.com/attachments/Image/play_up.gif" /></a></div>
</div>
<div style="width:103px; height:58px; background-color:red;"></div>

Answer 1

如果你的CSS中有top: -58，你就省略了'px'后缀 - 它应该是：

div.imgplay {
    position:relative;
    top:-58px;
    color:red;
    z-index:4;
}

以下解决方案摆脱position:relative箔条，直接进入小麦：

http://jsfiddle.net/4UEdJ/ （在Internet Explorer中未经测试：$）

Answer 2

你需要'位置：亲戚;'在你的最后一个div中，并改变顶部的位置，即

<div style="width:103px; height:58px; top:-58px; background-color:red; position: relative;"></div>