CSS для установки цвета фона только в процентах от ширины строки таблицы

У меня есть базовая таблица с двумя столбцами :имя и значение. Я хотел бы затенить каждую строку в таблице соответствующим процентом ширины в зависимости от размера значения (, чтобы по существу создать боковую гистограмму! ). Я могу написать код для расчета соответствующего процента для установки, но я не могу понять CSS, чтобы на самом деле правильно затенить каждую строку. Вроде всю строку можно заштриховать, но не процент.Это правда?

Что бы это ни стоило, я использую Twitter Bootstrap, и я также могу использовать jQuery, если это необходимо. Это работает только в Chrome, поэтому подходят только CSS3 и Webkit! Вот HTML:

<table class="table">
  <tbody class="lead">              
    <tr> 
      <td>
        Joe
      </td>
      <td>
        10
      </td>
    </tr>              
    <tr> 
      <td>
        Jane
      </td>
      <td>
        20 
      </td>
    </tr>              
    <tr> 
      <td>
        Jim
      </td>
      <td>
        2
      </td>
    </tr>
  </tbody>
</table>

Любые советы о том, как это сделать? Надеюсь, этот вопрос имеет смысл.