PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : position:absolute und zentriert


dav133
2007-12-02, 20:40:08
nabend,

ich möchte ein Element absolut über alle anderen exakt in der Mitte des Bildschirms platzieren. Wie stelle ich das an?

Man könnte einen 100% Breiten Container über alles legen und bei gewünschter Breite des eigentlichen Containers von bspw. 40% links und rechts je 30% Abstand lassen. Hoffe es ist klar geworden wie ichs meine, jedenfalls wollte ich sone Fusch-Lösung genausowenig wie wildes java-script rumgescripte.

Bietet CSS von Haus aus was dafür an?

lg

darph
2007-12-02, 21:38:20
Gar nicht, weil du nicht errechnen kannst, wie groß das Fenster ist, ohne JavaScript zu verwenden.

Du kannst das Objekt, wenn du ihm eine Breite gegeben hast, horizontal zentrieren. Vertikal wirst du entweder ein wenig rechnen müssen, oder dich mit Näherungen zufrieden geben müssen. top:45% oder so.

dav133
2007-12-02, 21:48:14
Du kannst das Objekt, wenn du ihm eine Breite gegeben hast, horizontal zentrieren.

Das will ich ja ;). Angenommen die Breite ist 40% und ich will es horizontal zentrieren, ist die einzige Möglichkeit dann wirklich "left:30%" zu setzen?

lg

clerfayt
2007-12-02, 22:17:33
Wenn sich der Browser im sog. standards-compliant mode befindet, sollte ein "margin: auto;" eigentlich ausreichen.

Ausführlicher zu dem Thema: http://css.fractatulum.net/sample/layout4format.htm#a1

Da gibts auch Hinweise zu möglichen Methoden, etwas vertikal zu zentrieren.

Viel Spaß beim Basteln :)

dav133
2007-12-02, 22:52:00
Wenn sich der Browser im sog. standards-compliant mode befindet, sollte ein "margin: auto;" eigentlich ausreichen.

Ausführlicher zu dem Thema: http://css.fractatulum.net/sample/layout4format.htm#a1

Da gibts auch Hinweise zu möglichen Methoden, etwas vertikal zu zentrieren.

Viel Spaß beim Basteln :)

Das bezieht sich leider alles auf position:relative. Trotzdem ne schöne Seite, danke ;).

lg

clerfayt
2007-12-02, 23:14:40
Ups, das hatte ich doch glatt übersehen/ überlesen. Dann gibt es noch die Methode mit den negativen margin:-Angaben, s. bspw. auf dieser Seite (http://www.thestyleworks.de/tut-art/centerblock.shtml). Ob und wie das mit negativen Prozentwerten funktioniert, müsstest Du mal schauen; ich glaube, es geht nur, wenn die Größe des zu positionierenden Objekts vorher wirklich bekannt ist. Womit dann wohl auch dieser Vorschlag wieder für die Tonne ist...:frown:

Tiamat
2007-12-03, 13:37:18
Hi ,
mit margin:0 auto; rückst du Elemente in die Mitte. Je nach angegebener Breite wird es automatisch mittig ausgerichtet.
Ob der IE damit Probleme hat, einfach testen.

DanMan
2007-12-03, 18:08:19
Ich verstehe nicht ganz was du willst. Welche Größen/Abstände sind fix, und welche variabel?

Tiamat
2007-12-04, 10:57:44
als Beispiel:
margin:0 auto; width:600px;

clerfayt
2007-12-05, 19:02:00
als Beispiel:
margin:0 auto; width:600px;

Das hatte ich ja auch schon vorgeschlagen, aber nicht bedacht, dass das ja nicht funktioniert, wenn das Element, wie vom TS gewünscht, mit position: absolute positioniert werden soll. Daher der Vorschlag, es in diesem Falle mit negativen Werten für margin: zu versuchen. Hier nochmal die Beschreibung. (http://www.thestyleworks.de/tut-art/centerblock.shtml)