[PHP][CSS] Problem z wypozycjonowaniem elementów na stronie Opcje

[nighttrain]

Witam

Mam mały problemik, otóż chciałbym, aby inputy oraz submity znalazły się na obrazku, wychodzi mi tak, że obrazek jest na środku, a inputy i submit układa się po lewej stronie...
Czy mógłby ktoś zobaczyć i pomóc?
Oto zdjęcie jak to wygląda:
(IMG:http://images49.fotosik.pl/800/b1b6b09aa7337236med.jpg)

oto kawałek kodu z index php:

[PHP] pobierz, plaintext 
<div id="login_form">
<h1>Login</h1>
<?php
function ShowLogin($komunikat=""){
	echo "$komunikat<br>";
	echo "<form action='index.php' method=post>";
	echo "<input type=text name=login><br>";
	echo "<input type=password name=haslo><br>";
	echo "<input type=submit value='Zaloguj!'>";
	echo "</form>";
	echo "Jeśli nie jesteś zarejestrowany, <a href='rejestruj.php'>tu znajdziesz formularz</a>";
}
?>
</div>
[PHP] pobierz, plaintext 

a to plik .css:

[PHP] pobierz, plaintext 
body {
background-color: #f0f0f0;
margin: 0;
padding: 0;
font-family: arial;
}
 
#login_form {
    width:300px;
    height: 200px;
    background: #f0f0f0 url(graphics/login_bg.jpg) repeat-x;
    border: 1px solid white;
    margin: 250px auto 0;
    padding: 1em;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    padding: 7px  5px  0  5px;
}
 
h1,h2,h3,h4,h5 {
    margin-top: 0;
    font-family: sans-serif;
    text-align: center;
}
 
input[type=text], input[type=password] {
  display:block;
  margin: 0 0 1em 0;
  width: 280px;
  border: 5px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
  padding: 1em;
}
 
input[type=submit], forma a {
  border: none;
  margin-right: 1em;
  padding: 6px;
  border: 5px;
  text-decoration: none;
  font-size: 20px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
  background: #348075;
  color: white;
  box-shadow: 0 1px 0 white;
    -moz-box-shadow: 0 1px 0 white;
    -webkit-box-shadow: 0 1px 0 white;
}
 
/* podświetlenie przycisku po najechaniu na niego */
input[type=submit]:hover {
    background: #287368;
    cursor: pointer;
}
[PHP] pobierz, plaintext 

Szczerze to kodzik css skopiowałem z jakieś stronki...

[askone]

Popatrz na ten prosty przykład i postaraj się ustawić podobnie u siebie:

[CSS] pobierz, plaintext 
.centered {
margin: 100px auto;
width: 410px;
}
#login_form {
border: 1px solid red;
width: 200px;
height: 300px;
float: left;
}
#drugi {
border: 1px solid yellow;
margin: auto, 0;
width: 200px;
height: 300px;
float: left;
}
[CSS] pobierz, plaintext 

[HTML] pobierz, plaintext 
<div class="centered">
<div id="login_form">
test
</div>
<div id="drugi">
drugi
</div>
</div>
[HTML] pobierz, plaintext