Creating a graph using percentage background images

• 20%
• 40%
• 60%
• 80%
• 100%

------------
HTML CODE
------------
<ul class="graph">
	<li class="percent20">20%</li>
	<li class="percent40">40%</li>
	<li class="percent60">60%</li>
	<li class="percent80">80%</li>
	<li class="percent100">100%</li>
</ul>

------------
CSS CODE
------------
ul.graph
{
	margin: 0;
	padding: 0;
	list-style-type: none;
}

ul.graph li
{
	margin-bottom: .5em;
	padding: .2em;
	background: #600;
	color: #fff;
}

ul.graph li.percent20
{
	background: url(graph20.jpg) repeat-y 20% 0;
}

ul.graph li.percent40
{
	background: url(graph40.jpg) repeat-y 40% 0;
}

ul.graph li.percent60
{
	background: url(graph60.jpg) repeat-y 60% 0;
}

ul.graph li.percent80
{
	background: url(graph80.jpg) repeat-y 80% 0;
}