IE6，绝对位置，100%宽度

Question

IE6的另一个问题。这是我的密码

HTML:

<div class="a">
    <div class="b">
        <div class="c">
            <span style="display:block; background:yellow; height: 170px; width:100%;"></span>
            <div class="d">
Hello World!            </div>
        </div>
    </div>
</div>

CSS:

.a{
    background: black;
    float: right;
    height: 200px;
    margin: 0 2px;
    width: 200px;
}

.b{
    padding: 15px 10px;
}

.c{
    position: relative;
}

.d{
    background-color: green;
    bottom: 0;
    color: white;
    opacity: 0.85;
    position: absolute;
    left: 0;
    width: 100%;
    zoom: 1;
}

.e{
    font-weight: bold;
    padding: 7px;
}

(在jsfiddle.net上的现场演示)。

在现代浏览器和IE6中检查它。你可以看到这样的事情：

​

​

怎么修呢？

Answer 1

试试这个：

HTML：

<div class="a">

            <span style="display:block; background:yellow; height: 170px; width:100%;"></span>
            <div class="d">
Hello World!            </div>


</div>

CSS：

.a{
    border: 1px solid black;
    border-width: 15px 10px;
    height: 170px;
    margin: 0 2px;
    width: 180px;
    position: relative;
    float: right;
}
.d{
    background-color: white;
    bottom: 0;
    color: black;
    opacity: 0.85;
    position: absolute;
    left: 0;
    width: 100%;
}

.e{
    font-weight: bold;
    padding: 7px;
}