Vertikale Ausrichtung in CSS?

Question

Also ich weiß alles über die Probleme mit vertical-align: middle; und den verschiedenen Methoden Menschen zu vertikalen align Elementen in CSS verwendet haben. Aber ich habe nicht eine gefunden, die funktioniert, was ich brauche es für zu arbeiten.

Im Grunde meine Seite hat nur eine <div> drauf, die ich in der Mitte der Seite positioniert werden soll, sowohl horizontal als auch vertikal. Offensichtlich ist der horizontale Teil ist einfach, aber ich bin immer hing an dem vertikalen Teil auf. Mein Problem ist, dass die Höhe des <div> ist unbekannt; der Inhalt ändert, so kann ich nicht eine Höhe für sie angeben.

Wer irgendwelche Tipps für mich? Ich bin bereit, JavaScript zu verwenden, wenn nötig. Dank!

Answer 1

Lange Rede kurzer Sinn, Sie müssen zwei divs CSS-nur vertikale Zentrierung zu erhalten.

Mit Javascript, können Sie tun es mit einem einzigen div , obwohl .

Answer 2

Wie Sie gesagt haben Sie nichts dagegen JS nicht verwenden, hier ist es ... (ich in der Regel Rückfall nie auf eine JS Lösung, aber wenn Sie mit ihm cool sind, dann so bin ich)

Wenn Ihr CSS

#element {
    position: absolute;
    top: 50%;
}

Dann könnte man meinen Freund jQuery

verwenden

$(document).ready(function() {
    var height = $('#element').height();
    $('#element').css({marginTop: '-' + (height / 2) + 'px'})

{);

Beachten Sie, dies ist nicht getestet, sollte aber ein Anfang. Hoffentlich wird die Höhe / 2 funktioniert wie erwartet, wenn nicht, versuchen parseInt() verwendet wird;