position: absolute inside table cell not working as expected in Internet Explorer

Question

I have a table cell, which contains an arrow on the bottom right of the cell:

Correct table cell

This works fine with all browsers except Internet Explorer, where the arrow aligns somewhere in the middle:

Incorrect table cell

The html of the table cell looks something like this:

<td>
  <a>Pitstop</a>
  <a class="arrow"></a>
</td>

And the CSS something like this:

td {
  position: relative;
}

.arrow {
  position: absolute;
  right: -1px;
  bottom: 0;
  display: block;
  width: 24px;
  height: 15px;
}

How can I get this to work?