Heizer: Element mittig positionieren

Beitrag lesen

Ich möchte links im Fenster ein Menu haben mit "position:fixed; left:0; top:0; height:100%; width:150px;". Das Klappt auch wunderbar, und nun möchte ich eine Grafik im verbleibenden Raum mittig und zentriert ausrichten, also versuchte ich es mit

position:absolute; top:0 left:150px; width:100%; height:100%; text-align:center; vertical-align:middle;

Das funktioniert aber nicht, die Grafik wird immer in der linken oberen Ecke angezeigt, allerdings mit den 150px abstand, also neber dem Menu.

Wenn Du ein Element bei oben 0, links 150 positionierst, wird es wohl kaum in der Mitte auftauchen können, oder? Darüberhinaus besagt text-align:center, daß der Text im Element zentriert wird, nicht das Element selber (http://www.w3.org/TR/REC-CSS2/text.html#alignment-prop).



Um ein Blockelement zu zentrieren, mußt Du margin-left und margin-right auf auto setzen (http://www.w3.org/TR/REC-CSS2/visudet.html#q6). Um Inline-Elemente zu zentrieren, setzt Du im darüberliegenden Element text-align auf center.

Da Deine Grafik sicherlich im verbleibenden Raum neben dem Menü zentriert werden soll und nicht im Fenster, mußt Du wohl neben dem Menü noch ein <div> aufmachen, daß als Container und Zentrierhilfe für die Grafik dient.

Sorry, ich hatte mich da etwas falsch ausgedrückt, ich hatte schon ein <div> außenherum. Das mit dem margin-left und margin-right funktioniert wunderbar, aber leider nicht in der Höhe. Hab gerade etwas herumprobiert, aber den Effekt, den eigentlich "vertical-align:middle" haben sollte, erreiche ich nicht. Gibt es da noch einen Anderen Trick?

Gruß,
  soenk.e

Danke und gruß zurück

Heizer