Box dynamique

Bonjour,

Je cherche à faire des box dynamiques variant en fonction du text qu'on y insère.
Le résultat semble potable sur IE mais pas sur les autres navigateurs.

Voici l'exemple:

<DIV id="gk_mc" style="z-index: 100; position: absolute; top: 10px; right: 10px;">
<DIV style="DISPLAY: inline; HEIGHT: 31px">
<DIV style="BACKGROUND-IMAGE: url(../src/images/jenson_left.png); WIDTH: 9px; DISPLAY: inline; BACKGROUND-REPEAT: no-repeat; BACKGROUND-POSITION: left 50%; HEIGHT: 31px; LEFT: 0px" key="RM"></DIV><SPAN style="BACKGROUND-IMAGE: url(../src/images/jenson_middle.png); DISPLAY: inline; BACKGROUND-REPEAT: repeat; HEIGHT: 31px; FONT-WEIGHT: bold; LEFT: 9px" key="RM">Roadmap</SPAN>
<DIV style="BACKGROUND-IMAGE: url(../src/images/jenson_right.png); WIDTH: 9px; DISPLAY: inline; BACKGROUND-REPEAT: no-repeat; HEIGHT: 31px; RIGHT: 0px" key="RM"></DIV></DIV>
<DIV style="DISPLAY: inline; HEIGHT: 31px">
<DIV style="BACKGROUND-IMAGE: url(../src/images/jenson_left.png); WIDTH: 9px; DISPLAY: inline; BACKGROUND-REPEAT: no-repeat; BACKGROUND-POSITION: left 50%; HEIGHT: 31px; LEFT: 0px" key="OP"></DIV><SPAN style="BACKGROUND-IMAGE: url(../src/images/jenson_middle.png); DISPLAY: inline; BACKGROUND-REPEAT: repeat; HEIGHT: 31px; FONT-WEIGHT: normal; LEFT: 9px" key="OP">Orthophoto</SPAN>
<DIV style="BACKGROUND-IMAGE: url(../src/images/jenson_right.png); WIDTH: 9px; DISPLAY: inline; BACKGROUND-REPEAT: no-repeat; HEIGHT: 31px; RIGHT: 0px" key="OP"></DIV></DIV>
</DIV>

Comment peut-on bien centrer le texte verticalement si les images et leurs paramètres sont dynamique ?

Merci de vos réponses d'avance