Masquer et réduire colonne Probleme IE

Bonjour,
Alors je vous explique mon cas, j' extrait des données d'une base de donnée afin de la mettre dans un tableau sur plusieurs colonnes et j'ai rajouter des bouton "checkbox" qui servent a masquer et surtout pour réduire les colonnes concernées.
Petit problème, ça marche avec Mozilla et ça masque sur Internet Explorer mais ça ne se réduit pas. Voila si quelqu'un a des idées pour me venir en aide . En vous remerciant

CODE :

<script type="text/javascript">

function getElements(classe) {
var col = document.getElementsByTagName("TD");
if (document.getElementById(classe).checked ) {

var largeur = "";
var visible = "visible";
var display = "table-cell"; //type d'affichage
}
else {

var largeur = "0px";
var visible = "hidden";
var display = "block";
}
for (var i = 0; i <col.length ; i++) {

if (col[i].className == classe){

col[i].style.display = display ;
col[i].style.width = largeur ;
col[i].style.visibility = visible ;
}
}
document.getElementById("id"+classe).style.display = display ;
document.getElementById("id"+classe).style.visibility = visible ;
document.getElementById("id"+classe).style.width = largeur ;
}
</script>


<span> <label for="chk1">Raison social</label>
<input checked="checked" id="raison" type="checkbox" onclick="getElements('raison')"/>
</span>

<th id = "idraison" style = "overflow:hidden; display:table-cell;"> Raison social </th>
<tr>
<td class = "raison" align= "center" style = "overflow:hidden; disfplay:table-cell;"> <?php echo odbc_result($result,"sCliRaisonSoc"); ?>
</td>
</tr>