Eine Box durch padding immer in der Mitte ausgeben

Hallo zusammen,

sagt mal, gibt es eine Möglichkeit eine Box immer in der Mitte des Browsers auszugeben?
Quasi sowas wie

margin-left: auto; margin-right: auto;

Aber für die Mitte?

Vielen Dank und besten Gruß!

CSS: horizontale und vertikale Zentrierung

Danke!
Mein Code:

<div id="modal-overlay" class="hidden"></div> <div class="shadow-top"></div> <div id="login_container"> <div id="main"> <div class ="login_box"> <div class ="login_text"> <form name="login" action="#"> <label for="name">Benutzername</label><br><input type="text" name="name"/> <br> <label for="password">Passwort</label><br><input type="password" name="password"/> <br> <button onclick="loginToCouch()">Anmelden</button> </form> </div> </div> </div> <footer> Impressum | Kontakt </footer> </div>[CODE]#login_container {
margin-left: auto;
margin-right: auto;
width: 280px;
padding-top:150px;
font-size:medium;
color:#777777;
}

#login_text {
padding-left:25;
}

input[type=text] {
background: -moz-linear-gradient(top, #fafafa, #f1f1f1);
border-style: solid;
border-width: 1px;
border-color: #ccc;
padding: 3px;
border-radius: 3px;
font-size:1.2em;
}

input[type=password] {
background: -moz-linear-gradient(top, #fafafa, #f1f1f1);
border-style: solid;
border-width: 1px;
border-color: #ccc;
padding: 3px;
border-radius: 3px;
font-size:1.2em;
}[/CODE]Habe folgendes schon probiert:

#login_container { margin-left: auto; margin-right: auto; width: 280px; [B] min-height: 10em; display: table-cell; vertical-align: middle [/B] font-size:medium; color:#777777; }

Brachte leider nichts.

Horizontale und vertikale Zentrierung mit CSS

In kurzen Stichpunkten

  • Gib den Elementen html und body height:100%;
  • Erstelle eine leere Box mit height:50%;
  • Setze darunter deine Box die du zentrieren willst und gib ihr eine fixe Höhe (zB: height: 300px; )
  • Gib ihr außerdem margin:0 auto;
  • Dann gibst du ihr noch eine negative margin-top, von der hälfte der Höhe deiner zu zentrierenden Box (zB: margin-top: -150px; )