Werbung:

Du befindest dich hier: codes/css/box_mittig

Ein Element genau im Browser-Fenster zentrieren

Du bist gerade dabei deine Seite zu Überarbeiten und möchtest ein einfaches Bild genau in der Mitte des Browser-Fensters Zentrieren?
Dies geht ganz leicht mittels CSS

Mittig Zentrieren

Beispiel

01:
02:
03:
04:
05:
06:
07:
08:
09:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
<head>
  <style type="text/css">
  body {
   margin: 0px;
  }

  #mitte {
   position: absolute;
   left: 50%;
   top: 50%;
   width: 300px; /* Breite des Elements */
   height: 200px; /* Höhe des Elements */
   margin-left: -150px; /* Breite des Elements geteilt durch zwei! */
   margin-top: -100px; /* Höhe des Elements geteilt durch zwei! */
  }
  </style>

 </head>
<body>

<div id="mitte">
 <img src="grafik.gif" width="300" height="200">
</div>