WCM Forum - Layouting mit CSS!? (für komplizierte Layouts?)

WCM Forum (http://www.wcm.at/forum/index.php)

- Programmierung (http://www.wcm.at/forum/forumdisplay.php?f=17)

- - Layouting mit CSS!? (für komplizierte Layouts?) (http://www.wcm.at/forum/showthread.php?t=173535)

Das is vorerst nur ein experiment.
dafür tut es aber in firefox und ie.
nur opera mag den javascript code nicht so ganz...

Zitat:

Original geschrieben von ruffy_mike
Die meisten Browser haben noch deutliche Schwierigkeiten mit komplexen CSS-Formatierungen (va. mit position- overflow- visibility-Attributen u. ä.). Also auf jeden Fall mit unterschiedl. Browsern testen, beim Vergleich IE vs. Firefox hatte ich oft zwei komplett unterschiedl. Layouts!

ja, das ist mir bei meinen ersten Spielereien auch schon aufgefallen....

nochmals @Sesa_Mina
um das ganze richtig zu verstehen:
nur durch das verwenden von top:50% und left:50% kann ich die restlichen Elemente absolut positionieren.
Und mit der margin Angabe schiebst du das ganze dann eigentlich in die Mitte (abhängig von der Größe der eigentlichen Seite - weil das habe ich schon auf meine Größe geändert)

bezüglich JS:
das ist bei meiner Seite tabu - braucht man sowieso nicht. *g* (weil das ganze soll brav als XHTML 1.0 strict validieren, mit der Ausnahme, dass ich wohl hie und da target="_blank" verwenden werde ;))

solange die anderen elemente sich im container (der ja zentriert wird) befinden beziehen sich deren koordinaten auf die obere linke ecke des containers. von daher funktioniert das mit der absoluten positionierung :)

...vorausgesetzt auch der Container hat position:absolute;

Der Witz an position:absolute; ist nämlich, daß alles absolut zum nächsten Eltern-Element ausgerichtet wird, daß auch position:absolute hat.

Code:

<div style="position: absolute; right: 0px; bottom: 0px;">

  <div style="position: absolute; left: 0px; top:0px;">Der innere Div sollte in 

der rechten unteren Ecke sein, obwohl er 

absolut links oben ausgerichtet ist.

  </div>

</div>

Wo man "position: absolute;" vermeiden kann sollte man es tun. Man handelt sich meist einen Haufen Probleme ein, wenn man es verwendet. "position: absolute;" sorgt dafür, daß das entsprechende Element aus dem Seiteninhalt "rausgerissen" wird, d.h. es kann passieren, daß sich andere divs drunter oder drüber schieben, daß übergeordnete divs auf einmal zu klein sind, usw.

jak