<td> & img & CSS

Bonjour,

Je débute donc merci d'être indulgent !
Je veux afficher un histogramme. Donc je me crée une table et je met un graphique dans chaque cellule dont je module la hauteur en fonction de la valeur. Ce qui donne :

<table id="GraphBar">
<tr>
<th>titre</th>
<td id="B0">10<img src="col.gif" width="14" height="10" alt="" /></td>
<td id="B1">21<img src="col.gif" width="14" height="21" alt="" /></td>
<td id="B2">39<img src="col.gif" width="14" height="39" alt="" /></td>
<td id="B3">17<img src="col.gif" width="14" height="17" alt="" /></td>
</tr>
<tr>
<th></th>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
</tr>
</table>

Ensuite, je voudrais un peu optimiser le truc car je répète à chaque fois une image pour chaque cellule.
Je pensais m'en sortir avec du CSS mais rien de marche. En particulier, le code ci-dessous ne donne rien :

<style>
.bargraph img{
display:block
border-right: 2px solid #FFFFFF;
border-top: 2px solid #FFFFFF;
img-src:url(col.gif)>
}
</style>

<table id="GraphBar" class="bargraph">
<tr>
<th>titre</th>
<td id="B0">10</td>
<td id="B1">21</td>
<td id="B2">39</td>
<td id="B3">17</td>
</tr>
<tr>
<th></th>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
</tr>
</table>

Question1 : est-il possible mettre l'image d'un TD dans du CSS ? Si oui, comment ?
Question2 : je voudrais modifier la hauteur d'une barre de mon histogramme en JS mais je n'y arrive pas. Voici le code que j'utilise (et qui ne donne rien) :

function UpdateData()
{
for (var i=0; i<4;i++) {
document.getElementById("B"+i).height = i*10 + "px";
}
}

Quelqu'un a une solution ?

Merci pour vos réponses !