Seite 1 von 1

div - horizontal und vertikal zentrieren

Verfasst: 16.12.2006 10:59
von klunzen
wie kann man ein div-element mittig ausrichten?

so dass es egal von der bildschirmauflösung immer in der mitte angezeigt wird..

thx

Verfasst: 16.12.2006 11:07
von StarWolf3000
müsste so gehen:

Code: Alles auswählen

<div style="position: absolute; text-align: center; vertical-align: middle">Text</div>

Verfasst: 16.12.2006 11:49
von fanrpg
Ehm nein text-align; gilt nur für Text nicht für das div selber.
Wenn da so evt.

Code: Alles auswählen

<div style="position:absolute; width:20%; margin-left:40%; margin-right:40%; vertical-align:middle;">Text</div>

Verfasst: 16.12.2006 16:39
von Mr Death
Hi,

es ist ganz einfach:

Code: Alles auswählen

<div style="width: 700px; margin: auto;">inhalt</div>
Die Breite halt entsprechen ändern.

MfG

/edit: sry, hab überlesen, dass du das div auch vertikal mittig haben willst.

Re: div - horizontal und vertikal zentrieren

Verfasst: 16.12.2006 17:11
von S2B
klunzen hat geschrieben:so dass es egal von der bildschirmauflösung immer in der mitte angezeigt wird..
Wie du schon siehst, geht das nur mit absoluter Positionierung (position: absolute).

Horizontale Zentrierung kannst du mit margin: auto lösen, vertikale hingegen funktioniert in CSS bis jetzt fast gar nicht (bei Text mit line-height und vertical-align, innerhalb von Tabellenzellen (<td> und <th>) mit vertical-align oder eben mit absoluter Positionierung).

Verfasst: 18.12.2006 20:10
von klunzen
habs mit

Code: Alles auswählen

#hintergrund {
	width: 800px;
	margin-left: -400px; /* halbe weite */

	height: 600px;
	margin-top: -300px; /* halbe höhe */

	position: absolute;
	top: 50%;
	left: 50%;
}
gelöst 8)

funzt prima.. egal bei welcher auflösung ab 800x600