DIV im DIV zentrieren - für Fortgeschrittene

26.01.2005, 19:39

Hi,

ich bastle gerade an meiner neuen Seite rum. Und gleich in der Anfangsphase der erste Fehler:

Im IE wird folgendes richtig angezeigt, in Firefox nicht.

Es wird richtig angezeigt, wenn die weiße Fläche auf dem Grau zentriert ist.

Code:

<html>
<head>
</head>
<body>
<div style="position: absolute; top:50%; width:100%; height:460px; background-color:#666666; margin-top:-230px; text-align:center">
  <div style="margin:0px; background-color:#ffffff; width:780px; height:460px;">
  </div>
</div>
</body>
</html>

Tutti · 26.01.2005, 20:35

Mach mal aus margin: 0px; -> margin: 0px auto;

26.01.2005, 20:42

JUHU!

Es klappt

Danke!

Was bewirkt denn dieses auto?

Tutti · 26.01.2005, 23:28

Zitat:

Zitat von CSS4YOU

auto weist den Browser an, den Wert automatisch zu berechnen.

Mit margin: 0px; legst du einen Aussenabstand bei allen 4 Flanken von 0px fest.
FF interpretiert das dann so, dass versucht wird allen Flanken diesen Wert zuzuweisen, so wie es auch sein soll, es sei denn du legst eine feste Breite deiner Container fest.
Hast du bei margin 2 Werte gilt der erste Wert für oben und unten und der zweite für rechts und links.
margin: 0px auto; heißt also oben und unten 0px zum Elternelement rechts und links selbst entscheiden wobei es da widerum dem FF nichts ausmacht ob text-align: angegeben ist, was auch wieder richtig ist da IMHO Blockelemente nicht mit Textflussangaben positioniert werden dürfen.

Der IE als Browserbratze schlechthin macht so ziemlich viel falsch

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
Seite Zentrieren	slimer	HTML, Usability und Barrierefreiheit	8	02.06.2006 13:15
Float für Fortgeschrittene	axelnes	HTML, Usability und Barrierefreiheit	5	12.04.2006 10:29
Tutorial für Fortgeschrittene	ApfeL	Beitragsarchiv	5	22.03.2006 12:38
Vertikal zentrieren mit CSS - so gehts.		HTML, Usability und Barrierefreiheit	2	02.03.2006 09: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
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
Tabelle absolut in der mitte zentrieren		HTML, Usability und Barrierefreiheit	16	27.09.2004 15:39
Tabelle zentrieren		HTML, Usability und Barrierefreiheit	11	04.09.2004 09:10
Inhalt mit css zentrieren	RudiS	HTML, Usability und Barrierefreiheit	3	03.07.2004 23:23

26.01.2005, 19:39
Gast Beiträge: n/a	DIV im DIV zentrieren - für Fortgeschrittene Hi, ich bastle gerade an meiner neuen Seite rum. Und gleich in der Anfangsphase der erste Fehler: Im IE wird folgendes richtig angezeigt, in Firefox nicht. Es wird richtig angezeigt, wenn die weiße Fläche auf dem Grau zentriert ist. Code: <html> <head> </head> <body> <div style="position: absolute; top:50%; width:100%; height:460px; background-color:#666666; margin-top:-230px; text-align:center"> <div style="margin:0px; background-color:#ffffff; width:780px; height:460px;"> </div> </div> </body> </html>


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

26.01.2005, 20:35
Tutti Erfahrener Benutzer Registriert seit: 23.07.2004 Beiträge: 100	Mach mal aus margin: 0px; -> margin: 0px auto; __________________

26.01.2005, 20:42
Gast Beiträge: n/a	JUHU! Es klappt Danke! Was bewirkt denn dieses auto?