4 DIVs gleichmäßig nebeneinander verteilen

[Klaus]

Hallo zusammen,

ich komm bei einem Problem einfach nicht weiter:
ich möchte 4 DIVs gleichmäßig nebeneinander anzeigen, aber ich bekomm das nicht hin.
Live: http://jsfiddle.net/eHYxX/1/

Der HTML-Code sieht so aus:

  
<div id="wrapper">  
   <div id="nr-1"></div>  
   <div id="nr-2"></div>  
   <div id="nr-3"></div>  
   <div id="nr-4"></div>  
</div>  

Ich habs schon mit diversen Einstellungen versucht.
So siehts noch am Besten aus, aber leider nicht über den gesamten Platz verteilt:

  
#wrapper { width:100%; border: solid 1px #999; text-align:center; margin: 0 auto; background-color:#aaa;}  
#nr-1,#nr-2,#nr-3,#nr-4 { display:inline-block; border: solid 1px #999; text-align:left; margin: 0 auto; background-color:#ccc; width:100px; height:100px;}  

Klaus