Vertical alignment of a div within a table cell - css

Question

I have a table with cells that contain one image and one text link each, in that order. I have successfully vertically aligned the image with CSS:
.tdClass img {vertical-align:middle;}
But I can't seem to get the text link underneath it to align to the bottom of the cell. No matter what I've tried, it stays put right underneath the image. The ultimate goal here is to make the cells uniform horizontally as much as possible when my images are different heights.
<table width="100%" class="tableClass" id="tableId">
<tbody>
<tr>
<td class="tdClass">
<a href="#">
<img src="#">
</a>
<div class="divClass">
TEXT
</div>
</td>
<td class="tdClass">
<a href="#">
<img src="#">
</a>
<div class="divClass">
TEXT
</div>
</td>
</tr>
</tbody>
</table>

Answer 1

Consider adding a uniform height to the links around the images, enough to fit the tallest image.
.img {
height: 50px;
display: table-cell;
vertical-align: middle;
}
<table width="100%" class="tableClass" id="tableId">
<tbody>
<tr>
<td class="tdClass">
<a href="#" class="img">
<img src="http://placekitten.com/50/50">
</a>
<div class="divClass">
TEXT
</div>
</td>
<td class="tdClass">
<a href="#" class="img">
<img src="http://placekitten.com/30/30">
</a>
<div class="divClass">
TEXT
</div>
</td>
</tr>
</tbody>
</table>

Answer 2

add this :
td{
border: 1px solid red;
height: 350px;
}
td a:first-child,
td .divClass{
vertical-align: middle;
display: inline-block;
*display: inline; // ie7
*zoom: 1; //ie7
}