Obliv, 'k hoor je maar op het moment is mijn div questie veel belangrijker, en later zal er nog veel veranderen, zal nog wel is nen check laten doen.
ru`orez:
Man ik moet wel heel dom klinken he, maar 'k kom er niet uit dus hé.
'k kan een simpelere, recht hoekige pagina volledig in" css/div" zetten no problem daar.
Nu vraagjes:
- om dat je "0,0" zegt positioneerd de naam "topdiv, middiv, bottom" dan je divs, of is het de "relative" dat dat doet ..?
- Is het zelfs mogelijk om een design zo volledig in css/div te zetten ('k veronderstel van wel) Maar dan doe ik elke div oftewel bottom/top, zal mijn voorbeeld css eens posten dat ik tot hiertoe heb aangemaakt.
Code:
#TitleDiv {
background-image: url(images/contentslice_01.jpg);
position: absolute;
top: 0px;
left: 75px;
width:815px;
height:151px;
z-index:2;
visibility: visible;
}
#PicDiv {
background-image: url(images/contentslice_04.jpg);
position: absolute;
left: 342px;
top:151px;
width:279px;
height:110px;
z-index:2;
visibility: visible;
}
#LoginDiv {
background-image: url(images/contentslice_22.jpg);
position: absolute;
left: 139px;
top:151px;
width:203px;
height:110px;
z-index:2;
visibility: visible;
}
#NieuwsField {
background-image: url(bg_tmp.jpg);
position: absolute;
top:260px;
bottom: 218px;
left: 139px;
width: 481px;
height: 521px;
z-index:2;
visibility: visible;
}
#ContentLeftStatus {
background-image: url(images/contentslice_05.jpg);
position: absolute;
top: 151px;
left: 620px;
width: 225px;
height: 100px;
z-index:2;
visibility: visible;
}
#ContentLeftWhere {
background-image: url(images/contentslice_07.jpg);
position: absolute;
top: 251px;
left: 620px;
width: 225px;
height: 185px;
z-index:2;
visibility: visible;
}
#ContentLeftCompo {
background-image: url(images/contentslice_13.jpg);
position: absolute;
top: 434px;
left: 620px;
width: 225px;
height: 294px;
z-index:2;
visibility: visible;
}
#LeftPiston {
background-image: url(images/contentslice_02.jpg);
position: absolute;
top: 151px;
left: 75px;
width: 64px;
height: 110px;
z-index:2;
visibility: visible;
}
#RightPiston {
background-image: url(images/contentslice_06.jpg);
position: absolute;
top: 151px;
left: 845px;
width: 59px;
height: 110px;
z-index:1;
visibility: visible;
}
#LeftPistonDown {
background-image: url(images/Globalslice_11.jpg);
position: absolute;
Bottom: 4px;
left: 139px;
width: 28px;
height: 215px;
z-index:1;
visibility: visible;
}
#RightPistonDown {
background-image: url(images/Globalslice_13.jpg);
position: absolute;
Bottom: 4px;
left: 808px;
width: 37px;
height: 215px;
z-index:1;
visibility: visible;
}
#Left1 {
background-image: url(images/contentslice_09.jpg);
position: absolute;
top: 261px;
left: 75px;
width: 64px;
height: 140px;
z-index:2;
visibility: visible;
}
#Left2 {
background-image: url(images/Globalslice_09.jpg);
position: absolute;
bottom: 4px;
left: 75px;
width: 64px;
height: 597px;
z-index:1;
visibility: visible;
}
#Right1 {
background-image: url(images/contentslice_08.jpg);
position: absolute;
top: 261px;
left: 845px;
width: 59px;
height: 170px;
z-index:2;
visibility: visible;
}
#Right2 {
background-image: url(images/Globalslice_15.jpg);
position: absolute;
bottom: 4px;
left: 845px;
width: 59px;
height: 566px;
z-index:1;
visibility: visible;
}
#BottomDiv {
background-image: url(images/Globalslice_14.jpg);
position: absolute;
bottom: 4px;
left: 167px;
width: 641px;
height: 88px;
z-index:1;
visibility: visible;
}
#BottomDivBanners {
background-image: url(images/Globalslice_12.jpg);
position: absolute;
bottom: 92px;
left: 167px;
width: 641px;
height: 127px;
z-index:1;
visibility: visible;
}
Dat roep ik dan op met deze html :
*
Eb het is enkel en alleen de deze:
<div id="NieuwsField"></div>
dat de pagina zal moeten uit rekken.
Code:
<link href="wrwlan.css" rel="stylesheet" type="text/css">
<body>
<div id="TitleDiv"></div>
<div id="LoginDiv"></div>
<div id="LeftPiston"></div>
<div id="PicDiv"></div>
<div id="ContentLeftStatus"></div>
<div id="ContentLeftWhere"></div>
<div id="Left1"></div>
<div id="RightPiston"></div>
<div id="Right1"></div>
<div id="ContentLeftCompo"></div>
<div id="BottomDiv"></div>
<div id="Right2"></div>
<div id="Left2"></div>
<div id="LeftPistonDown"></div>
<div id="RightPistonDown"></div>
<div id="BottomDivBanners"></div>
<div id="NieuwsField"></div>
</body>
Maar toch rekt dit niet, loopt nog steeds over mijn andere "divs".
Nu 'k kan begrijpen waarom nog, omdat ik nog steeds "absolute" werk ... maar met zulk design moet je toch posities kunnen ingeven, anders wanner ik "relative" gebruik hebbek een gefragmenteerde site ?
Om de bovenkant van de site boven te centraliseren, gebruik ik bv.:
- top: 151px;
En om de onderkant te positioneren gebruik ik bv.:
- bottom: 4px;
*
Sorry ze dat het er niet ingaat, maar zit al uren en uren te zoeken op google en te testen, maar vind het dood gewoon niet.
