Goedendag,

Ik probeer mijn site in het midden van de pagina te krijgen maar het wil niet echt lukken
hij moet alleen horizontaal gecentreerd worden
in layer 34 zitten alle andere layers
voorbeeld: http://84.83.30.85/SkullDump

dit is de css die ik gebruik voor mijn site:


body {
border: 0;
padding: 0;
text-align: center;
height: 96%;
}

#Layer34 {
width: 955px;
height: 500px;
margin-left: auto;
margin-right: auto;
margin-top: 9%;
}



#Layer1 {
    position:absolute;
    left:0px;
    top:0px;
    width:180px;
    height:77px;
    z-index:8;
    background-image: url(Afbeeldingen/Grid 3.gif);
    background-image: url(Afbeeldingen/Grid%204.png);
}
#Layer2 {
    position:absolute;
    left:180px;
    top:0px;
    width:626px;
    height:77px;
    z-index:9;
    background-color: #191919;
}
#Layer3 {
    position:absolute;
    left:806px;
    top:0px;
    width:190px;
    height:77px;
    z-index:10;
    background-image: url(Afbeeldingen/Grid%201.PNG);
}
body {
    background-color: #191919;
}
#Layer4 {
    position:absolute;
    left:0px;
    top:77px;
    width:996px;
    height:25px;
    z-index:11;
    background-image: url(Afbeeldingen/Balk%201.PNG);
}
#Layer5 {
    position:absolute;
    left:0px;
    top:102px;
    width:180px;
    height:350px;
    z-index:12;
    background-image: url(Afbeeldingen/Grid%202.PNG);
}
#Layer6 {
    position:absolute;
    left:180px;
    top:102px;
    width:816px;
    height:350px;
    z-index:13;
    background-color: #354147;
}
#Layer7 {
    position:absolute;
    left:0px;
    top:450px;
    width:996px;
    height:25px;
    z-index:14;
    background-image: url(Afbeeldingen/Balk%201.PNG);
}
#Layer8 {
    position:absolute;
    left:0px;
    top:477px;
    width:180px;
    height:133px;
    z-index:15;
    background-image: url(Afbeeldingen/Grid%203.gif);
}
#Layer9 {
    position:absolute;
    left:25px;
    top:118px;
    width:98px;
    height:27px;
    z-index:9;
}
#Layer10 {
    position:absolute;
    left:25px;
    top:310px;
    width:98px;
    height:27px;
    z-index:10;
}
#Layer11 {
    position:absolute;
    left:25px;
    top:246px;
    width:98px;
    height:27px;
    z-index:11;
}
#Layer12 {
    position:absolute;
    left:25px;
    top:182px;
    width:98px;
    height:27px;
    z-index:12;
}
#Layer13 {
    position:absolute;
    left:25px;
    top:214px;
    width:98px;
    height:27px;
    z-index:13;
}
#Layer14 {
    position:absolute;
    left:25px;
    top:278px;
    width:98px;
    height:27px;
    z-index:14;
}
#Layer15 {
    position:absolute;
    left:25px;
    top:150px;
    width:98px;
    height:27px;
    z-index:15;
}
#Layer16 {
    position:absolute;
    left:937px;
    top:78px;
    width:62px;
    height:25px;
    z-index:16;
}
#Layer17 {
    position:absolute;
    left:2px;
    top:576px;
    width:136px;
    height:25px;
    z-index:17;
}
#Layer18 {
    position:absolute;
    left:2px;
    top:568px;
    width:64px;
    height:43px;
    z-index:18;
    background-color: #FFFFFF;
}
#Layer19 {
    position:absolute;
    left:176px;
    top:0px;
    width:225px;
    height:78;
    z-index:19;
}
#Layer20 {
    position:absolute;
    left:363px;
    top:511px;
    width:83px;
    height:57px;
    z-index:19;
}
#Layer21 {
    position:absolute;
    left:194px;
    top:121px;
    width:703px;
    height:25px;
    z-index:18;
    background-color: #191919;
}
#Layer22 {
    position:absolute;
    left:183px;
    top:596px;
    width:321px;
    height:13px;
    z-index:19;
}
#Layer23 {
    position:absolute;
    left:264px;
    top:270px;
    width:78px;
    height:39px;
    z-index:20;
}
#Layer24 {
    position:absolute;
    left:279px;
    top:207px;
    width:59px;
    height:33px;
    z-index:20;
}
#Layer25 {
    position:absolute;
    left:39px;
    top:0px;
    width:66px;
    height:40px;
    z-index:20;
}
#Layer26 {
    position:absolute;
    left:25px;
    top:134px;
    width:98px;
    height:27px;
    z-index:20;
}
#Layer27 {
    position:absolute;
    left:25px;
    top:171px;
    width:98px;
    height:27px;
    z-index:21;
}
#Layer28 {
    position:absolute;
    left:25px;
    top:207px;
    width:98px;
    height:27px;
    z-index:22;
}
#Layer29 {
    position:absolute;
    left:25px;
    top:243px;
    width:98px;
    height:27px;
    z-index:23;
}
#Layer30 {
    position:absolute;
    left:25px;
    top:279px;
    width:98px;
    height:27px;
    z-index:24;
}
#Layer31 {
    position:absolute;
    left:25px;
    top:315px;
    width:98px;
    height:27px;
    z-index:25;
}
#Layer32 {
    position:absolute;
    left:25px;
    top:387px;
    width:98px;
    height:27px;
    z-index:26;
}
#Layer33 {
    position:absolute;
    left:25px;
    top:351px;
    width:98px;
    height:25px;
    z-index:27;
}



Iemand enig idee hoe ik dit kan oplossen?
Dat ik als ik een resolutie heb van 1280x786 de site netjes horizontaal is gecentreerd op het beeldscherm?
Layer 34 wordt keurig gecenteerd (zet background-color: #FFF;) van deze layer dan zie je het.
Voeg eens aan layer 34 dit toe:
position: relative;
overflow:auto;
heb ik gedaan alleen nu krijg ik van die scrollbars.. dat was niet egt de bedoeling
margin: auto;

misschien ook in de body?
Een div centreren doe je zo:

#mijndiv {
    margin: 0px auto;
    width: 900px; /* of wat je wilt */
    border: 1px solid black; /* ter controle, later weghalen */
}

Ik dácht dat het mij gelukt was. (het centreren enzo) In IE doetie het ook. Maar in FF doetie het niet :'(

Dat word voor mij weer een dag blokken.
Hoi Lotte,

als je begint met een simpele testpagina, met daarin alleen die regels uit mijn vorige post, dan moet het goed gaan. Heb je ook het goede doctype boven je pagina staan? HTML4 strict?
Geen idee wat dat is dus ik dénk het niet. :P
Dankjewel!

Ik zal het er eens bijzetten. =)

Reageren