Zur Navigation

DIV mit CSS hor. zentrieren, vertikal aber positionieren!

1 Aladdin (Gast) (Gast)

Hallo,

Ich habe alle die Beiträge zum Zentrieren von DIVs mit CSS gelesen. Das witzige ist nur, dass da nur über die Horizontale pos. geredet wird. Scheinbar hat da niemand das Problem einen DIV horizontal zu zentrieren aber zugleich vertikal auf eine beliebige Position zu legen.

Ich habe das Problem, dass ich ein "Error" DIV bei Bedarf horizontal mittig auf die vertikale Position 100px anzeigen will!

Alle meine versuche haben gescheitert! Sobald ich mit position:absolute; top:100px; die Position angeben will ist die Zentrierung weg!

Hat da jemand einen Tip?

11.05.2005 15:43

2 Jörg Kruse

Hallo Aladdin,

mit position:absolute lässt sich margin:auto nicht kombinieren. So sollte es aber gehen:

margin:100px auto 0;

11.05.2005 16:01

3 Aladdin (Gast)

Hi,

Vielen Dank für den Tip...man so einfach. Wenn man auf eine Idee fixiert sit, dann siehr man die anderen Möglichkeiten nicht! :-(

Aber jetzt eine andere Frage:
Ich möchte wie oft hier angesprochen meine Seite in drei teile (header, content und footer) aufteilen, die insgesamt zentriert erscheinen sollen. Wie mache ich es am besten. Ein Container zentriert aussen rum, und dann die einzelen bereiche als innen DIV reinpacken oder wie anders?

11.05.2005 16:28

4 Aladdin (Gast)

Ach noch etwas:

wenn ich die gesamte Seite, also auch inhalte mit DIVs aufbaue, muss ich (denke ich) zwangsweise auch mit absolute positionierung arbeiten. Kommt es dann nicht zu dem bekannten Problem, dass auf einmal die Zentrierungen weg sind!?

Sorry für die vielleicht trivialen Fragen, bin nicht so bewandert mit den feinheiten von CSS!

gruß

11.05.2005 16:35

5 Jörg Kruse

Ein Container zentriert aussen rum, und dann die einzelen bereiche als innen DIV reinpacken

ja, würde ich auch so machen, dann muss manm die Zentrierung nur einmal vornehmen

muss ich (denke ich) zwangsweise auch mit absolute positionierung arbeiten.

nicht zwangsweise, ich würde es erst einmal ohne position:absolute probieren. Und wenn du doch einmal nicht drum herum kommst, absolut zu positionieren, wäre es vielleicht eine Möglichkeit, ein äußeres div (in voller Breite) absolut zu positionieren, und ein inneres div darin zu zentrieren

11.05.2005 16:50

6 ralph (Gast)

aber was gebe ich css ein um den"absoluten div" auf meiner Seite egal welche auflösung, zentriert dastellt

13.05.2005 12:41

7 Jörg Kruse

Ich würde, wie gesagt, zwei divs ineinander verschachteln. Das äußere wird absolut positioniert, das innere zentriert. Beispiel:

<div style="position:absolute; top:20px; left:0; width:100%; text-align:center">
<div style="margin:auto; width:400px; text-align:left; background-color:#f00; padding:20px">Test
</div>
</div>

13.05.2005 12:59

8 ralph (Gast)

danke erstmal jörg, habe in der html datei zu stehen <div id=center>... und in der css datei #center {position:absolut;top:0px;left:8%;right:8%;sowie höhe und breite. will aber das die gesamte seite durch einen befehl in css für alle browsergrößen zentriert ist.

13.05.2005 15:30

9 ralph (Gast)

habe problem beseitigt. manchmal ist man einfach nur blind. habe in der css datei einfach left:50%;
margin-left:-425%; alles wird gut

13.05.2005 16:34

10 Aladdin (Gast)

Hallo Jörg und andere,

vielen Dank für die Hilfe. Ich werde es ein wenig mal austesten. Ich habe aber irgendwie weiterhin probleme wenn ich:

eine zentrierte DIV außen habe und innen absolute positionieren will. Scheinbar klappt es, es verschiebt sich aber nicht mit dem äußeren DIV, wenn ich den Browserfenster in die Breite kleiner/größer mache!!! Was kann ich denn hier machen?

17.05.2005 14:39