H2 et centrage sur background image

Bonsoir,

Le titre ne doit pas être clair, je voudrais centrer le texte "calendrier" sur l'image h2.jpg (206 x 22), là il est en haut et centré...
J'ai essayé vertical-align:middle; mais rien :'(
(c'est dans un blog dotclear )

#sidebar h2{
	margin: 0 0 0 0;
	text-align: center;
	font-size: 11px;
	font-weight: normal;
	font-family: Verdana, Arial, Geneva, sans-serif;
	background: url(img/h2.jpg) no-repeat;
	background-position: left center;
	width:206px;
	height:22px;
}

<div id="sidebar">
	<div id="calendar">
	<h2>Calendrier</h2>

Bonjour,

vertical-align sert à positionner un élément inline (au sens CSS) dans la ligne. Vu le code fourni, ton élément h2 n'est pas inline, ceci explique donc cela.

De toute façon le positionnement d'éléments inline n'est pas simple du fait de bugs de certains navigateurs...

Dans le contexte d'éléments bloc je pense à 2 moyens d'action :
- réglage du positionnement de l'image en background en définissant son positionnement en pixel ou en pourcentage (remplace center par 45% par exemple (j'ai pris 45 au hasard))
- réglage du positionnement du texte avec les padding haut et bas

je crois que ça va être vite fait mal fait : une image dans le xhtml !
le padding change dans ie (pas firefox )

Si tu n'es pas satisfait de ta solution rapide, à l'occasion met un exemple en ligne.