Position eines Div's

Status
Nicht offen für weitere Antworten.
Achja und nochwas! Worin liegt der Unterschied zwischen id und class! was macht man mit id anders als class?

Danke

Grüße Matthias
 
Bei mir wird das DIV mit deinem korrigierten Source-Code in allen Browsers horizontal und vertikal zentriert :confused:

  • Browsercheck: FF 1.0.2, IE 6.0, MOZ 1.6, NN 7.0, OP 7.23


[ editpost 12:56 ]

Vermutlich hast du die Hintergrundgrafik in der CSS-Datei index.css falsch referenziert, und hierbei die Verzeichnisstruktur / Unterordner nicht berücksichtigt?

Eine ID kann in einem Dokument / einer Seite nur einmal vergeben / verwendet werden, CSS-Klassen hingegen X-mal.
 
Zuletzt bearbeitet von einem Moderator:
Komisch!

Bei mir funktioniert das einfach nicht!
auch im Internet Explorer wird das Div nicht zentriert und mit weißem Hintergrund dargestellt => gleich wie im Firefox

Code:
.sitediv_u { 
            background-color:#000000;
            border:solid 0px;
            padding:2px;
            text-align:center;
            vertical-align:middle;
            position:absolute;
            left:50%;
            width:760px;
            margin-left: -380px; /*negative Hälfte von width:760px = horizontal zentriert */
            top:50%;
            height:420px; 
            margin-top:-210px; /*negative Hälfte von height:420px = vertikal zentriert */   
            background-image:url(img/hue/bg.gif);
            background-repeat:no-repeat;            
           }

Hier ist der gesamte Code habe diesen Teil jetzt in eine eigene CSS Datei getan.
Hier nochmal der HTML Code:

Code:
<html>
  <head>
    <title>
      test
    </title>
    <link rel="stylesheet" type="text/css" href="test.css">
  </head>
  <body bgcolor="#FFFFFF">
    <div class="sitediv_u">
      test
    </div>
  </body>
</html>

Warum geht das nicht?


Grüße Matthias
 

Anhänge

  • testie.JPG
    testie.JPG
    16,2 KB · Aufrufe: 113
  • testff.JPG
    testff.JPG
    9,4 KB · Aufrufe: 113
ich hätte eine frage hierzu:

HTML:
div#center
{
position: absolute;
left: 50%;
width: 500px;
margin-left: -250px; /* negative Hälfte von width:500px = horizontal zentriertes DIV */
top: 50%;
height: 300px;
margin-top: -150px; /* negative Hälfte von height:300px = vertikal zentriertes DIV */
}
was bringt das
HTML:
position: absolute;
und das:
HTML:
width: 500px;
margin-left: -250px; /* negative Hälfte von width:500px = horizontal zentriertes DIV */
danke im Voraus.
 
copy + paste den CSS-Code in ein HTML-Dokument und du wirst sehen, was das bringt :)

Spass beiseite, die DIV-Box wird horizontal und vertikal im Browserfenster zentriert.
 
Status
Nicht offen für weitere Antworten.
Zurück