Falls man ein DIV über den „normalen“ Seitenaufbau legen möchte, hat man u. U. folgendes Problem:
- Position: Relativ funktioniert nicht, da man die Position des DIV dann zwar an die Seitenbreite anpassen kann, jedoch „hängt“ es sich in den Seitenaufbau und verdrängt andere DIVs
- Position: Absolut funktioniert zwar (wenn der z-Index höher als bei allen anderen Elementen ist), jedoch kann man dann das DIV immer nur absolut positionieren
Wie kann ich die beiden Eigenschaften kombinieren?
Die Lösung ist Javascript:
Vorbereitung
Es ist im IE problemlos möglich, die Seitenbreite zu ermitteln.
Im Firefox hingegen hatte ich Probleme, da dieser nicht zurückgibt, ob die Bildlaufleiste angezeigt wird oder nicht.
Meine Umgehungslösung: Ich blende die Bildlaufleiste einfach immer ein (dadurch „springt“ mein zentriertes Layout auch nicht immer um ein paar Pixel hin und her):
html {
overflow: scroll;
}
Das Script
In der ersten Zeile wird der FF behandelt, in der zweiten der IE.
Der IE gibt die Breite richtig zurück, beim FF zähle ich bei der Breite noch die Bildlaufleiste dazu:
if (navigator.appName.indexOf('Netscape') != -1) { FensterBreite = self.innerWidth - 20}
else if (navigator.appName.indexOf('Microsoft') != -1) { FensterBreite = document.body.clientWidth };
document.getElementById(divname).style.right = (FensterBreite / 2 - 474)+"px";
Loading…