Eine Box durch padding immer in der Mitte ausgeben

[Binary]

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ß!

 

[NetAktiv]

CSS: horizontale und vertikale Zentrierung

 

[Binary]

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>

#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;
}

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.

 

[mermshaus]

Horizontale und vertikale Zentrierung mit CSS

 

[Space Vampire]

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; )