Label should fill entire table cell

HTML

<table>
    <tr id='temp'>
        <td>a</td>
        <td>b</td>
        <td>c</td>
    </tr>
</table>

CSS

td {
    border: 1px solid #000;
    height: 100%;
}
.link-table-cell {
    height: 1px;
}
.inner-link {
    height:100%;
    width:100%;
    background-color: Yellow;
}
.link-wrapper {
    position: relative;
    background-color: Fuchsia;
    height: 100%;
}
label {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: block;
    border: 3px solid #f00;
}
label:hover {
    background-color: red;
    color: white;
}

JavaScript

$(document).ready(function () {
    $('#temp').children().each(function(){
    	$(this).append("-------||");
    })
});