il problema sicuramente è stupido, ma visto che sono alle prime armi con i css non riesco proprio a venirne fuori......
in teoria dovrebbe essere tutto allineato al centro, invece con ff è tutto allineato a sinistra, e con explorer è tutto allineato verso destra.....

la pagina è questa:

codice:
<html>

<head>
<title>
	Pagina di test
</title>
<style type="text/css">
@import url("stile2.css");
</style>
</head>

<body>

<div id="main">

	<div id="titolo">Benvenuti </div>
	<div id="logo">[img]images/general/logo.jpg[/img]</div>

<form action="checklogin.php" method="post" autocomplete="off">

	<div id="contenuto">Inserire Credenziali di Accesso</div>
	
	<div id="campi">
	Username

	Password

	</div>
	<div id="inserimento">
	<input type="text" id="username" name="username">

	<input type="password" name="password" onfocus="this.value=''"></div>
	<div id="pulsanti">
	<input type="submit" value="Accedi">
	<input type="reset" value="Annulla">
	</div>
</form>

</div>

</body>
</html>
e questo è "stile2.css"

codice:
html,body{margin: 0;padding:0}
body{font-family: bitstream vera sans; font-size: 12px;text-align:center;}
div#main{position:relative; width: 980px;margin: 0 auto;text-align:center;border-left: 2px solid #36c;border-right: 2px solid #36c}
div#titolo{position:absolute;top:20px;margin-left: auto;margin-right: auto;}
div#logo{position:absolute;top:50px;text-align:center;margin-left: auto;margin-right: auto; }
div#contenuto{position:absolute;top:110px;text-align:center; margin-left: auto;margin-right: auto;}
div#campi{position:absolute;top:150px;text-align: center; margin-left: auto;margin-right: auto;}
div#inserimento{position:absolute;top:150px;text-align: left;margin-left: auto;margin-right: auto;}
div#pulsanti{text-align:center;position:absolute;top:220px;margin-left: auto;margin-right: auto;}
dove sto sbagliando?

un grazie in anticipo a chiunque mi possa dare una mano