semplice grafico orizzontale...

non capisco però perchè con la dichiarazione doctype le barre restano schiacciate...

senza infatti prendono il loro valore.

codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<style>

.chart {
	font-family: Tahoma;
	font-size: .7em;
	border: 1px solid #ccc;
	float: left;
	margin: 0;
	padding: .4em .1em;
}

.chart li {
display: block;
	list-style: none;
	float: left;
	width: 5em;
	text-align: center;
	background: url(../images/chart_bg.gif) center 1.6em no-repeat;
}

.chart li span {
	display: block;
	text-indent: -999em;
	padding-bottom: 70px;
	background: url(../images/chart_bg_ol.gif) center -1px no-repeat;
	border-top: 5px solid #fff;
}

.chart strong {
	display: block;
	text-align: center;
	font-weight: normal;
}



</style>

<ul class='chart'>[*]marzo<span style="background-position: center -30">: </span>0 €[*]aprile<span style="background-position: center -30">: </span>2000 €[*]maggio<span style="background-position: center -30">: </span>3556 €
[*]giugno<span style="background-position: center -30">: </span>3456 €[*]luglio<span style="background-position: center -30">: </span>2000 €[*]agosto<span style="background-position: center -30">: </span>2000 €[*]settembre<span style="background-position: center -30">: </span>4000 €[*]ottobre<span style="background-position: center -30">: </span>0 €
[/list]