Absolute Positioning inside a table cell in IE

Question

I\'m having some issues with absolute positioning inside a table cell in Internet Explorer (9 specifically, but I\'m sure the issue exists in <9 as well). I\'m trying to

Answer 1

In case someone is still interested in this; a simple solution will fix the issue on IE 10 (my current target).

You need to have a nested div to locate your absolute positioned element:

<td>
    <div>
        <a href="#">FULL HEIGHT</a>
    </div>
</td>

And then add some css, including the lil trick for IE:

td {
    position: relative;
    height: 1px; // IE FIx
}
td > div {
    height: 100%;
}
td > div a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    // Beauty only
    background-color: orange;
    color: white;
    text-decoration: none;
}

Answer 2

I recommend you instead of positioning your element to all directions, use only two of them and instead, use size for your div.

like:

div {
    position: absolute;
    top:0;
    bottom:0;
    width: 100%;
    height: 100%
}

td {
    position: relative;
    width: 400px;
    height: 400px;
}