Progress bars in tables in pure CSS

In order to display my backup status, I use a HTML page generated in PHP, which parses the log files.

I wanted to get a visual indication of the backup sizes, bytes transferred, etc. and I came up with this very lightweight solution : I use a span element with a defined width. For this to work properly, the trick is to use display:block

Here is the code:

<table id="backup_summary">
  <tr><th>date</th><th>backup size</th></tr>
  <tr><td>28 October</td><td class='number'><span style='background-color:#F88;display:block;width:39%'>159GB</span></tr>
  <tr><td>27 October</td><td class='number'><span style='background-color:#F88;display:block;width:37%'>132GB</span></tr>
</table>

And this is the result: