CSS formatiert <DIV>s mit 'display:inline' nicht

[Pierre Dole]

Hallo Leute,
ich bin am verzweifeln, nein, ich am ausflippen...

Folgender CSS-Code:

  
#topCol {  
	background-color: #000000;  
	display: block;  
	width: 950px;  
}  
  
#leftCol {  
	background-color: #DDDDDD;  
	display: inline;  
	width: 220px;  
}  
  
#mainCol {  
	background-color: #BBBBBB;  
	display: inline;  
	width: 100%;  
}  
  
#rightCol {  
	background-color: #999999;  
	display: inline;  
	width: 220px;  
}  

die HTML-Template dazu:

  
<div id="topCol">{top}</div>  
<div id="leftCol">{left}</div>  
<div id="mainCol">{main}</div>  
<div id="rightCol">{right}</div>  

Ich glaube es ist selbsterklärend was ich erreichen möchte. Nun, topCol macht er richtig, den Rest fasst er nicht an. Gut, denk ich mir, der einzige Unterschied zwischen den Formatierungen von topCol und den anderen ist das 'display'. Habe somit 'inline' mit 'block' ersetzt und auf einmal nimmt er die Formatierung an. Ändere ich es wieder zurück, sehe ich weder die Hintergrundfarbe noch stimmt die Breite. Nehme ich das display aus der Definition heraus, wird auch nicht formatiert.
Was zur Hölle geht hier schief!?

PS: bevor sich einer über die Farben totlacht, die sind nur zum Gucken da, ob alles stimmt.