Auch divs vertical Zentrieren.

von **veNom** am 26.08.2007, 19:09

Hallo,

ja ich habe den Thread unter mir gesehen, ja ich habe den Beitrag von Tutorials.de gelesen, ja ich habe diesen gerade in Verwendung, ja er funktioniert auch, aber nicht bei der Auflösung 1024x768.

Es handelt sich um meine Seite die im Showroom vorgestellt habe
http://www.venom-media.at/markus/

Bei meiner Auflösung 1280x1024 funktioniert diese Weiße der veriktalen Ausrichtung, aber bei einer Auflösung von 1024x768 nicht, da es zu hoch ist und die margin Werte in den Minus Bereich gehen.

Gibt es eine andere möglichkeit ohne das man die Margin Werte in den Minus-bereich gibt?

von **Dac-XP** am 26.08.2007, 19:31

Also das einzige, was mir noch einfällt ist vertical-align:
http://www.css4you.de/Texteigenschaften ... align.html

von **Ingo** am 26.08.2007, 21:32

N'Abend allerseits.

Jup, das is nich einfach. Horizontales Zentrieren geht ja mit margin:auto
ganz locker; vertikal sieht das anders aus; vertical-align funktioniert nur,
wenn das (umrahmende) Element ein inline-Element ist (span, img, a,...),
aber nicht bei body, divs etc. Allein mit CSS seh ich hier keinen Weg.

Vllt. aber so: Man lässt das div #root da wo es ist (top:0px oder ähnlich),
den Rest erledigt dann ein JavaScript, d.h.

In der style_de.css bei #root die top- und die margin-top-Angabe entfernen.
In der .html erledigt dann ein Script die Sache (body: onload beachten):

Code: Alles auswählen: <script type="text/javascript"> function fixmt() { var y; if (self.innerHeight) // all except Explorer { y = self.innerHeight; } else if (document.documentElement && document.documentElement.clientHeight) { y = document.documentElement.clientHeight; } // Explorer 6 Strict Mode else if (document.body) // other Explorers { y = document.body.clientHeight; } var root = document.getElementById('root'); if (y - root.offsetHeight > 0) root.style.top = (y - root.offsetHeight)/2 + 'px'; }; </script> </head><body onLoad="fixmt()">

Den y-Teil (if) hab ich von quirksmode, dort 'cross browser scripts'.

Das Ding beschafft sich die verfügbare Höhe, zieht davon die #root-Höhe ab;
wenn dabei etwas Positives 'rauskommt, wird das halbiert und als #root-top gesetzt.

Wenn JavaScript abgeschaltet ist, bleibt der natürliche top-Wert (0px) wie er ist.

von **veNom** am 26.08.2007, 21:43

hi macping,

danke für das Script, es funktioniert Problemlos, und sollte dank Javascript eigentlich auch zu 99% von allen Browsern supported werden.

PS: Sowas wäre schon einen Kurztipp wert

Auch divs vertical Zentrieren.

Auch divs vertical Zentrieren.

Wer ist online?