Ik ben bezig met een site te maken voor mijn vader en heb nu de voorpagina en de resterende pagina's zo'n beetje in elkaar. Echter, de voorpagina staat qua layout hoger dan de andere pagina's. Pics ter verduidelijking:
http://img704.imageshack.us/img704/3685/voorpagina.png
http://img31.imageshack.us/img31/9473/resterend.png
Nu vraag ik mij af, waar gaat dat fout, hopelijk kan iemand van jullie het ontdekken.
Code HTML voorpagina;
Code:
<HTML>
<HEAD>
<link href="index.css" rel="stylesheet" type="text/css">
<TITLE>Template</TITLE>
</HEAD>
<BODY>
<div id="header"><img src="../Home/images/FMVulkers800x600_01.png"></div>
<div id="welkom"><img src="../Home/images/FMVulkers800x600_02.png"></div>
<div id="galerij"><img src="../Home/images/FMVulkers800x600_03.png"></div>
<div id="contentbox"><img src="../Home/images/FMVulkers800x600_04.png"></div>
<div id="galerijbox"><img src="../Home/images/FMVulkers800x600_05.png"></div>
<div id="menuselect"><img src="../Home/images/FMVulkers800x600_07.png"></div>
<div id="text"><b>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</b> <br><br>
In posuere libero ante, commodo iaculis lorem. Duis metus augue,
interdum et laoreet non, accumsan quis tortor. Sed lobortis suscipit luctus. Integer posuere, ipsum nec dictum condimentum, felis massa
mattis libero, vel ultrices tortor justo nec ligula. Suspendisse sit amet massa ac turpis porta lobortis eu nec tortor. Mauris at libero
erat, eget interdum sem. Integer vel velit justo. Aenean lectus mi, posuere quis cursus quis, fringilla sed dolor. Phasellus ut libero ante.
Integer a tortor augue. Nunc eleifend posuere nisl vel hendrerit. Aenean arcu odio, ornare ac posuere id, facilisis eget ipsum. Proin
tincidunt ornare rutrum. Phasellus ullamcorper mauris at urna auctor facilisis id vel mauris. Donec euismod libero ut massa tristique
rhoncus. Maecenas in nibh eros. Maecenas quis dolor mauris, eu convallis risus. Donec sit amet augue eu dui dictum viverra.
<br><br>
<b>Quisque sit amet est metus.</b> <br><br>
Aliquam dolor dui, scelerisque sed sodales nec, aliquet eu ante. Mauris vehicula gravida nisl, at fringilla
mauris dictum sit amet. Ut vehicula, nisi vitae feugiat adipiscing, velit quam pulvinar est, id mollis arcu dui et augue. Vivamus sit amet
lorem dui, sit amet ornare dui. Curabitur ultricies eros in libero convallis id fermentum lacus gravida. Nullam elementum metus laoreet nulla
venenatis eleifend. Integer ligula leo, volutpat non cursus egestas, dapibus non purus. Aenean dapibus ultrices justo, id dictum diam tempor a.
Quisque sit amet turpis mauris, vitae commodo quam. Nulla facilisi. Etiam eget luctus nisi. Sed a vehicula sem. Curabitur vulputate blandit velit,
ut pharetra lorem euismod quis. In in enim quis ante dapibus hendrerit eget sed leo. Sed eget orci sed mauris auctor vestibulum id quis dui.
Sed ultrices ligula in dolor mollis a molestie ante facilisis. Sed condimentum semper ipsum nec pharetra. Vivamus semper sollicitudin risus,
sed facilisis eros suscipit a. Mauris condimentum pulvinar enim, id suscipit metus interdum in. </div>
</BODY>
</HTML>
Code CSS voorpagina:
Code:
body{ background-image:url('../Home/images/800x600background.png');}
div#header
{ width: 800px;
height: 148px;
position: relative;
left: 20%;
}
div#welkom
{ width: 547px;
height: 25px;
float: left;
position: relative;
left: 20%;
}
div#galerij
{ width: 253px;
height: 25px;
float: left;
position: relative;
left: 20%;
}
div#contentbox
{ width: 547px;
height: 398px;
float: left;
position: relative;
left: 20%;
}
div#galerijbox
{ width: 253px;
height: 396px;
float: left;
position: relative;
left: 20%;
}
div#menuselect
{ width: 98;
height: 30;
position: absolute;
top: 20.7%;
left: 26.2%;
}
div#text
{ width: 430px;
height: 350px;
font-family: verdana;
font-size: 9;
color: white;
position: absolute;
top: 33%;
left: 27%;
}
HTML code resterende pagina's:
Code:
<HTML>
<HEAD>
<link href="recent.css" rel="stylesheet" type="text/css">
<TITLE>Template</TITLE>
</HEAD>
<BODY>
<div id="header"><img src="../Recent Werk/images/FMVulkers800x600[2]_01.png"></div>
<div id="welkom"><img src="../Recent Werk/images/FMVulkers800x600[2]_02.png"></div>
<div id="text"><b>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</b> <br><br>
In posuere libero ante, commodo iaculis lorem. Duis metus augue,
interdum et laoreet non, accumsan quis tortor. Sed lobortis suscipit luctus. Integer posuere, ipsum nec dictum condimentum, felis massa
mattis libero, vel ultrices tortor justo nec ligula. Suspendisse sit amet massa ac turpis porta lobortis eu nec tortor. Mauris at libero
erat, eget interdum sem. Integer vel velit justo. Aenean lectus mi, posuere quis cursus quis, fringilla sed dolor. Phasellus ut libero ante.
Integer a tortor augue. Nunc eleifend posuere nisl vel hendrerit. Aenean arcu odio, ornare ac posuere id, facilisis eget ipsum. Proin
tincidunt ornare rutrum. Phasellus ullamcorper mauris at urna auctor facilisis id vel mauris. Donec euismod libero ut massa tristique
rhoncus. Maecenas in nibh eros. Maecenas quis dolor mauris, eu convallis risus. Donec sit amet augue eu dui dictum viverra.
<br><br>
<b>Quisque sit amet est metus.</b> <br><br>
Aliquam dolor dui, scelerisque sed sodales nec, aliquet eu ante. Mauris vehicula gravida nisl, at fringilla
mauris dictum sit amet. Ut vehicula, nisi vitae feugiat adipiscing, velit quam pulvinar est, id mollis arcu dui et augue. Vivamus sit amet
lorem dui, sit amet ornare dui. Curabitur ultricies eros in libero convallis id fermentum lacus gravida. Nullam elementum metus laoreet nulla
venenatis eleifend. Integer ligula leo, volutpat non cursus egestas, dapibus non purus. Aenean dapibus ultrices justo, id dictum diam tempor a.
Quisque sit amet turpis mauris, vitae commodo quam. Nulla facilisi. Etiam eget luctus nisi. Sed a vehicula sem. Curabitur vulputate blandit velit,
ut pharetra lorem euismod quis. In in enim quis ante dapibus hendrerit eget sed leo. Sed eget orci sed mauris auctor vestibulum id quis dui.
Sed ultrices ligula in dolor mollis a molestie ante facilisis. Sed condimentum semper ipsum nec pharetra. Vivamus semper sollicitudin risus,
sed facilisis eros suscipit a. Mauris condimentum pulvinar enim, id suscipit metus interdum in. </div>
</BODY>
</HTML>
CSS resterende pagina's:
Code:
body{ background-image:url('../Recent Werk/images/800x600background.png');}
div#header
{ width: 800px;
height: 148px;
position: relative;
left: 20%;
}
div#welkom
{ width: 547px;
height: 25px;
float: left;
position: relative;
left: 20%;
}
div#text
{ width: 430px;
height: 350px;
font-family: verdana;
font-size: 9;
color: white;
position: absolute;
top: 33%;
left: 27%;
}
Andere aanvullingen op de code zijn uiteraard ook welkom, maar het liefst het probleem eerst even op te lossen..