boutons mixtes alignes

Salut,
je suis en train de me battre pour uniformiser des boutons avec des
contenus mixtes contenus dans des div. Je teste avec 4 navigateurs :
Opera, IE6, IE7, Firefox. Je n'arrive pas à obtenir des boutons
uniformes.

présentation souhaitée

<div float:left>[texte][image][image]</div>
et sur la même ligne <div centré>[texte][texte+image][image]</div>

pour se faire j'ai écrit
<div style='float:left'>
<form ....>
<button ..>
<div>
text
</div>
</button>
<button ..>
<div>
<img src='img1.gif' height='10' width='10'>
</div>
</button>
<button ..>
<div>
<img src='img2.gif' height='10' width='10'>
</div>
</button>
</form>
</div>

<div style='margin-left:auto;margin-right:auto;width:200px'>
<button ..>
<div>
texte
</div>
</button>
<button ..>
<div>
<img src='img3.gif' align='left' height='10' width='10'>
texte
</div>
</button>
<button ..>
<div>
<img src='img5.gif' height='10' width='10'>
</div>
</button>
</div>

avec dans ma feuille de style:
button {text-transform:capitalize;font-size:10px;}
button div {display:inline; height:20px}

J'obtiens ça
http://cjoint.com/?cwqUgmrBgk

Pouvez-vous m'aider à obtenir quelque chose de plus présentable ?
Merci