Gracias amigo, esta casi completamente bien.
Seria mejor si las columnas estan lo mas cerca posible unas de otras, esto por cuestion de estetica ya que posiblemente se requieran reportes de hasta 24 barras (comparacion de años donde esten todos los meses), como esta ocuparia un ancho excesivo.
Edite un poco tu codigo para sacar las lineas que vi no hacen nada y me quedo lo siguiente:
Código HTML:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
table {
font:11px Verdana, Arial, Helvetica, sans-serif;
color:#777;
padding:0px;
}
.barrasv {
width:30px;
text-shadow:#CCC 0.1em 0.1em 0.1em;
-moz-border-radius:5px;
-webkit-border-radius:5px;
box-shadow:1px 1px 1px black;
-webkit-box-shadow:1px 1px 1px black;
-moz-box-shadow:1px 1px 1px black
}
.verticalmente {
position:relative;
-webkit-transform:rotate(-90deg);
-moz-transform:rotate(-90deg);
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
writing-mode:tb-rl;
filter:flipv fliph;
}
#etiq td {
height:100px;
width:30px;
}
-->
</style>
</head>
<body>
<table align="center" cellpadding="0" cellspacing="0" border="1">
<tbody align="center">
<tr>
<td valign="bottom"><div class="barrasv" style="height:31.6px; background-color:#BDDA4C"> </div></td>
<td valign="bottom"><div class="barrasv" style="height:43.5px; background-color:#FF9A68"> </div></td>
<td valign="bottom"><div class="barrasv" style="height:15.8px; background-color:#69ABBF"> </div></td>
<td valign="bottom"><div class="barrasv" style="height:1.9px; background-color:#FFDE68"> </div></td>
<td valign="bottom"><div class="barrasv" style="height:6.9px; background-color:#AB6487"> </div></td>
</tr>
<tr>
<td>31.6%</td>
<td>43.5%</td>
<td>15.8%</td>
<td>1.9%</td>
<td>6.9%</td>
</tr>
<tr id="etiq">
<td width="30"><div class="verticalmente"><strong>Productos Varios</strong></div></td>
<td width="30"><div class="verticalmente"><strong>Repuestos de Vehiculos</strong></div></td>
<td width="30"><div class="verticalmente"><strong>Enceres</strong></div></td>
<td width="30"><div class="verticalmente"><strong>Bienes Muebles</strong></div></td>
<td width="30"><div class="verticalmente"><strong>Bienes Inmuebles</strong></div></td>
</tr>
</tbody>
</table>
</body>
</html> La cereza al pastel seria poder colocar arriba de la barra el valor de la misma.