63130
10.11.2008, aktualisiert am 14.11.2008
7135
9
0
Div Bereich vertikal Zentrieren
Ich arbeite derzeit an einer Seite, für welche ich einen Div Bereich auf einer Seite zentrieren muss.
Hallo,
ich arbeite derzeit an einer Seite und habe dabei ein Problem: Der Inhalt der Seite soll zentriert werden. Der Inhalt steht in einem Div Bereich, welcher demnach sowohl horizontal als auch vertikal mittig auf der Seite stehen soll, egal bei welcher Auflösung.
Hier eine Vorschau wie es aktuell aussieht: http://www.tekstr.de/developer/helen
Und hier der Quelltext:
Die oben im Quelltext erwähnte CSS Datei ist zur Zeit noch leer. Also wie kann ich den Div Bereich (Außenrand) vertikal zentrieren? Irgendeine Idee?
Vielen Dank schonmal
Grüße
Max aka v3rtico
Hallo,
ich arbeite derzeit an einer Seite und habe dabei ein Problem: Der Inhalt der Seite soll zentriert werden. Der Inhalt steht in einem Div Bereich, welcher demnach sowohl horizontal als auch vertikal mittig auf der Seite stehen soll, egal bei welcher Auflösung.
Hier eine Vorschau wie es aktuell aussieht: http://www.tekstr.de/developer/helen
Und hier der Quelltext:
<html>
<head>
<title>Helen's Seite</title>
<link rel="stylesheet" type="text/css" href="style/style.css">
</head>
<body>
<!-- Außenrand-->
<div align="center" style="margin: 0 auto" >
<div
align="center"
style="
padding-left:50px;
padding-right:170px;
width:730px;
height: 580px;
border:1px solid black;
margin: auto;">
<!-- Innenrand-->
<div style="
width:639px;
height: 364px;
border:1px solid black;
margin-top: 145px;
padding-left: 50px;
padding-right: 50px;
padding-top: 20px;
padding-bottom: 20px">
Innenrand
</div>
Dies ist die äußere Box
</div>
</div>
</body>
</html>Die oben im Quelltext erwähnte CSS Datei ist zur Zeit noch leer. Also wie kann ich den Div Bereich (Außenrand) vertikal zentrieren? Irgendeine Idee?
Vielen Dank schonmal
Grüße
Max aka v3rtico
Auf Facebook teilen
Auf Twitter teilen
Auf Reddit teilen
Auf Linkedin teilenBitte markiere auch die Kommentare, die zur Lösung des Beitrags beigetragen haben
Content-ID: 101417
Url: https://administrator.de/forum/div-bereich-vertikal-zentrieren-101417.html
Ausgedruckt am: 23.12.2024 um 05:12 Uhr
9 Kommentare
Neuester Kommentar
Hallo,
ich würde das wie folgt machen (ungetestet!):
Du setzt den Nullpunkt in die Mitte und verschiebst dann den DIV um die Hälfte der DIV-Höhe nach oben. Setzt natürlich voraus, dass Du eine fixe Höhe hast.
vg
Bytecounter
ich würde das wie folgt machen (ungetestet!):
...
margin-top:50%;
margin-bottom:50%;
padding-top:-290px;
...Du setzt den Nullpunkt in die Mitte und verschiebst dann den DIV um die Hälfte der DIV-Höhe nach oben. Setzt natürlich voraus, dass Du eine fixe Höhe hast.
vg
Bytecounter
Hi,
ich habe das auf einer Intranetseite so gelöst, indem ich eine Seite mit Frames gebaut habe, die die Seite mit dem Inhalt umschließen.
Frames sind zwar nicht mehr so ganz Zeitgemäß, aber es funktioniert.
Gruß
rittzrattz
ich habe das auf einer Intranetseite so gelöst, indem ich eine Seite mit Frames gebaut habe, die die Seite mit dem Inhalt umschließen.
Frames sind zwar nicht mehr so ganz Zeitgemäß, aber es funktioniert.
Gruß
rittzrattz
Das funktioniert leider nicht. Framesets möchte ich eher nicht verwenden.
Hi Max,
wenn du bei jeder Auflösung eine Zentrierung erwirken willst, darfst du nicht mit Pixeln arbeiten. Da es relative Größen sind, nimm em:
Mfg
Mitchell
PS: Der Link oben funktioniert nicht mehr, die Datei ist nicht mehr da.
wenn du bei jeder Auflösung eine Zentrierung erwirken willst, darfst du nicht mit Pixeln arbeiten. Da es relative Größen sind, nimm em:
<!-- Innenrand-->
<div style="margin:5em 5em 5em 5em; width:639px; height: 364px; border:1px solid black;">
Innenrand
</div>Mfg
Mitchell
PS: Der Link oben funktioniert nicht mehr, die Datei ist nicht mehr da.
Hmm bei mir funktioniert er wunderbar...
Stimmt ich habe den Ordner umbenannt, die neue Datei liegt in www.tekstr,de/developer/helen das hatte ich vergessen.
ich habe dann mal den Link oben für alle geändert, damit man direkt drauf zugreifen kann 
Mfg
Mitchell
PS: Sieht gut aus die Seite ^^
Mfg
Mitchell
PS: Sieht gut aus die Seite ^^
wie siehts hier aus, schon Neuigkeiten?
Mfg
Mitchell
Mfg
Mitchell
