HTML: DIV's zentriert nebeneinander

[McMatze]

Ich habe da ein Problem mit den DIV's in HTML.

Ich will drei DIV's zentriert nebeneinander.
Dass die drei nebeneinander aufgebaut werden, dass habe ich ja schn hinbekommen. Aber ich bekomme das nicht, dass diese dann auch zentriert auftreten...

style.css

#card_main {
	margin-left:80px;
	margin-right:80px;
	border:1px solid black;
}
#card_text {
 	float:left;
	text-align:center;
	margin:0 auto;
	width:260px;
	background-color:#F28826;
	border:1px solid black;
}
#card_pin {
 	float:left;
 	margin-left:10px;
	text-align:center;
	width:290px;
	background-color:#F28826;
	border:1px solid black;
}
#card_button {
 	margin:0 auto;
 	width:290px;
	text-align:center;
}

Die Site, auf der die drei zentriert nebeneinander aufgebaut werden.

<div id="card_main">
   <div id="card_text">
      <p>Deine aktuelle PIN: <input type="password" name="alt_pw" size="4" maxlength="4" /></p>
   </div>
   <div id="card_pin">
      <p>Deine neue PIN: <input type="password" name="new_pw" size="4" maxlength="4" /></p>
   </div>
   <div id="card_pin">
      <p>Widerhole deine neue PIN: <input type="password" name="new_pw_re" size="4" maxlength="4" /></p>
   </div>
   <br />
   <br />
   <br />
   <br />
   <div id="card_button">
      <input type="submit" value=" PIN ändern " />
      <input type="reset" value=" Zurücksetzen " />
   </div>
</div>

Die drei input-Felder sollen nebeneinander zentriert erscheinen.
Danke im Voraus für jeden Tipp!

MfG NoobI

PS: Bitte meckert nciht über meinen schlechten Programmierstil... Ich weiß es mittlerweile...

 

[Kasn]

gib card_main mal margin: auto;

 

[McMatze]

Tut sich leider auch nichts...

 

[pajaa]

margin-left und margin-right müssen natürlich weg, sprich durch margin: auto; ersetzt werden.

 

[Optimus*Prime]

Jap, margin: auto; stimmt.

Immer drauf achten, dass für eine Position kein Befehl doppelt ist, da der andere sonst je nach dem überschrieben wird.

Grüße