Claudia Kreissl Mediengestalterin für Digital- und Printmedien
Digitale Medienwelt

DIV horizontal und vertikal zentrieren

Für die Positionierung eines Containers direkt in der Mitte des Browserfensters muss die Höhe und die Breite des divs bekannt sein. Dann positioniert man das DIV 50% von der Fenstergröße und nimmt dann per margin-left und margin-top die Hälfte der Breite wieder weg.

CSS-Code:

div {
	  width: 800px;
	  height: 300px;
	  position: absolute;
	  left: 50%;
	  top: 50%;
	  margin-left: -400px;
	  margin-top: -150px;
}

HTML-Code:

<html>
<head>
<title>Webseite horizontal und vertikal zentrieren</title>
<style type="text/css">
...
</style>
</head>
<body>
<div>
</div>
</body>
</html>