Div's centreren

Door Zero XT op 28-07-2006 01:58

927 views

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?

Zero XT

28-07-2006 18:16

maar ik heb al geprobeerde om daar relative in te vullen maar dan gaat alles naar het midden maar komt alles onder elkaar
hoe los ik dat op?

Kalle P

28-07-2006 18:28

geen position mee geven.
http://www.phpfreakz.nl/artikelen.php?aid=115

Jan Koehoorn

28-07-2006 18:28

Ik zie dit in je code:


<div align="center" id="Layer34">
<div id="Layer1"></div>
<div id="Layer2"><img src="Afbeeldingen/Logo/Home.png" width="626" height="77"></div>
<div id="Layer3"></div>

<div id="Layer4"></div>

<div id="Layer5"></div>
<div id="Layer6"></div>
<div id="Layer7"></div>
<div id="Layer8"></div>

waar dient dat voor? Of heb je de lay-out laten genereren door ImageReady?

Zero XT

28-07-2006 18:32

Ik gebruik macromedia dreamweaver 8.0 en als ik een layer trek dan zet ie dat er zo in.

En ik had al gekeken op phpfreakz.nl maar daar komen ze niet met een goed antwoord ook had ik dat al gelezen Kalle, maar tog bedankt voor de hulp

Jelle -

28-07-2006 18:38

[offtopic]
Misschien moet je je id's anders benamen, want layer1 2 3 etc is niet echt overzichtelijk. geef ze namen waar het voor staat, heb je een scherm waar fouten woorden weergegeven? noem die waring ofzo.
[/offtopic]

Zero XT

28-07-2006 18:43

ik heb geen fouten... alles doet het alleen niets komt in het midden haha

Jan Koehoorn

28-07-2006 19:07

Kris Kuiper schreef op 28.07.2006 18:32
Ik gebruik macromedia dreamweaver 8.0 en als ik een layer trek dan zet ie dat er zo in.

PHP hulp

28-07-2006 19:11

Jan Koehoorn schreef op 28.07.2006 19:07
[quote=Kris Kuiper schreef op 28.07.2006 18:32]Ik gebruik macromedia dreamweaver 8.0 en als ik een layer trek dan zet ie dat er zo in.

Ja, dan werk je dus in de design-view. Dat betekent dat je totaal geen controle hebt over wat er allemaal in je code komt. Leer te werken in de code-view en bouw je lay-out van de grond af op. Nu ben je al veel te ver gevorderd op de verkeerde manier om een goede oplossing mogelijk te maken.[/quote]

En daarom ben ik blij dat mijn zus mij Frontpage heeft verboden en kladblok aan mij liet zien. Nu snap ik gelukkig de code's zelf goed en kan ik makkelijk aan de slag. Al ga ik wel kijken hoe dreamweaver werkt want anders heeft mijn vader het er voor niks opgezet. Hij maakt toch geen site's meer. :P

Jan Koehoorn

28-07-2006 19:24

DreamWeaver is zeker een aanrader, maar begin onmiddellijk in de code-view. DreamWeaver heeft in de code-view:

[li]syntax highlighting[/li]
[li]code completion[/li]
[li]auto indenting[/li]

Ook goed is een ingebouwde FTP module die je kunt koppelen aan de Save optie waardoor opslaan en uploaden tegelijk gebeuren.

Verder zijn er nog dingen als code snippets en ga zo maar door.

Zero XT

28-07-2006 19:33

maar alles wat ik wil is dat alles gecentreerd word.... en dan moet ik mijn hele site overnieuw maken????

Reageren

Inloggen om te reageren