Vertikal zentrieren mit CSS - so gehts.

28.02.2006, 23:41

Dei mein Posting ein einziger Denkfehler war...... forget it!

Hier meine Lösung für vertikales Zentrieren via CSS.

Da ich weiss, dass VIELE Schwierigkeiten damit haben, irgend etwas OHNE
Tabellen vertikal zu zentrieren, mag der Quelltext der besagten Seite
diesen Leuten eine Hilfe sein

Liebe Grüße, Catweazle

Hier mein Code

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>1952</title>

<?php
#######################################################################
### LAYOUT FÜR SEITE/CONTENT ###

$seitenbreite = 994; # Breite des Bildes
$seitenhoehe  = 568; # Höhe des Bildes

$rand_links = (int)($seitenbreite/2);
$rand_oben  = (int)($seitenhoehe/2);

echo<<<stylesheet
<style type="text/css">
body {
 margin:0px;
 padding:0px;
 margin-left:0px;
 margin-top:0px;
 width:{$seitenbreite}px;
 height:{$seitenhoehe}px;
 background-color:{$seiten_farbe};
 overflow:hidden;}

#seitenlayout {
 z-index:1;
 position:absolute;
 top:50%;
 left:50%;
 width:{$seitenbreite}px;
 height:{$seitenhoehe}px;
 background-color:transparent;
 margin-left:-{$rand_links}px;
 margin-top:-{$rand_oben}px;
 overflow:hidden;}

stylesheet;
?>

<div id="seitenlayout">
Alles hier drin ist, abhängig von Seitenbreite und Seitehöhe (siehe oben) vertikel zentriert.
</div>
</body>
</html>

farant · 01.03.2006, 18:03

also wer sich mit horizontaler zentrierung zufrieden gibt kann auch

Code:

#seitenlayout {
margin: 0 auto;
}

anwenden

imported_Ben · 02.03.2006, 09:15

Die Suche sollte eigentlich auch das hier hervorbringen:

http://scholz-webdesign.de/css/demo/zentrieren/

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
seite zentrieren	DarkManX	HTML, Usability und Barrierefreiheit	8	27.06.2007 20:11
hr aber vertikal	einballimwasser	HTML, Usability und Barrierefreiheit	2	12.06.2006 20:24
Seite Zentrieren	slimer	HTML, Usability und Barrierefreiheit	8	02.06.2006 13:15
Tebellen zentrieren?	Smily0412	HTML, Usability und Barrierefreiheit	3	26.11.2005 11:03
input=text zentrieren	md5hash	HTML, Usability und Barrierefreiheit	2	07.11.2005 17:42
DIV-Bereich zentrieren	Benny	HTML, Usability und Barrierefreiheit	2	25.08.2005 17:06
Tabelle vertikal ausrichten	dethlef14	HTML, Usability und Barrierefreiheit	14	23.08.2005 13:32
Text im Bild zentrieren	inu	PHP Tipps 2005	19	10.05.2005 15:34
&lt;div&gt;- container vertikal auf seite zentrieren		HTML, Usability und Barrierefreiheit	3	08.05.2005 11:16
Tabelle im DIV-Container zentrieren		HTML, Usability und Barrierefreiheit	1	21.04.2005 22:28
[Erledigt] Tabelle Zentrieren		HTML, Usability und Barrierefreiheit	11	21.10.2004 20:41
Text in Tabelle wird nicht vertikal mittig dargestellt		HTML, Usability und Barrierefreiheit	1	06.10.2004 14:24
Tabelle absolut in der mitte zentrieren		HTML, Usability und Barrierefreiheit	16	27.09.2004 15:39
Layer vertikal zentrieren	Locutus007	HTML, Usability und Barrierefreiheit	4	05.09.2004 15:44
Tabelle zentrieren		HTML, Usability und Barrierefreiheit	11	04.09.2004 09:10


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

01.03.2006, 18:03
farant Benutzer Registriert seit: 18.07.2005 Beiträge: 90 PHP-Kenntnisse: Fortgeschritten	also wer sich mit horizontaler zentrierung zufrieden gibt kann auch Code: #seitenlayout { margin: 0 auto; } anwenden

02.03.2006, 09:15
imported_Ben Erfahrener Benutzer Registriert seit: 18.09.2003 Beiträge: 13.598 PHP-Kenntnisse: Fortgeschritten	Die Suche sollte eigentlich auch das hier hervorbringen: http://scholz-webdesign.de/css/demo/zentrieren/ __________________ Webentwickler-Blog - Buchbesprechung PHP Design Patterns - SQL-Antipatterns