Nu heb ik met pijn en moeite alles in het midden gekregen klik je op een link verschuift de navigatie balk rechts helemaal naar de rechter kant
wat is er nu weer niet goed
wat is er nu weer niet goed
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css"></style>
<link href="stylesheet/basic.css" rel="stylesheet" type="text/css" />
<style type="text/css"></style>
</head>
<style type="text/css">
#container {
position: relative;
width: 780px;
margin: 0 auto;
border: 1px solid green;
}
#apDiv1 {
position:absolute;
top:9px;
z-index:1;
border: 1px solid red;
overflow: hidden;
left: 10px;
height: 111px;
}
#apDiv2 {
position:absolute;
top:122px;
width:200px;
height:465px;
z-index:2;
border: 1px solid blue;
}
#apDiv3 {
position:absolute;
left:615px;
top:120px;
width:165px;
height:465px;
z-index:3;
border: 1px solid fuchsia;
}
</style>
<body>
<div id="container">
<div id="apDiv1"><a href="index.php"><img src="afbeeldingen/logo_energynet.gif" width="766" height="113" alt="Home" /></a></div>
<div id="apDiv2">
<p><br />
<img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="index.php?p=algemene_informatie">Algemene informatie</a><br />
<a href="index.php?p=tarieven">Tarieven</a><br />
<a href="index.php?p=pakketen">Pakketten</a><br />
<img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="index.php?p=service">Service en onderhoud</a><br />
<a href="index.php?p=energyservice">EnergyService</a><br />
<a href="index.php?p=product">Productadvies</a><br />
<a href="index.php?p=besparingtips">Besparingstips</a><br />
<img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="index.php?p=vraagentwoord">Vraag en antwoord</a><br />
<a href="index.php?p=mail">Per e-mail</a><br />
<a href="index.php?p=chat">Via chat</a><br />
<img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="index.php?p=gegevens">Uw gegevens</a><br />
<a href="index.php?p=nota">Nota en verbruik</a><br />
<a href="index.php?p=meterstanden">Meterstanden doorgeven</a><br />
<a href="index.php?p=verhuizing_doorgeven">Verhuizing doorgeven</a></p>
</div>
<div id="apDiv3">
<p><img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="index.php?p=verhuizing_doorgeven">Verhuizen, wat nu?</a><br />
<img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="index.php?p=besparingtips">Besparingstips</a><br />
<img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="index.php?p=klantenservice">Klantenservice</a></p>
<p> </p>
<form id="form1" name="form1" method="post" action="">
<p>
<label for="e-mail"></label>
e-mailadres :<br />
<label for="e-mail2"></label>
<input type="text" name="e-mail" id="e-mail2" />
<br />
wachtwoord: <br />
<label for="wachtwoord"></label>
<input type="text" name="wachtwoord" id="wachtwoord" />
</p>
<p><a href="index.php?p=succesvol_ingelogd.html"><img src="afbeeldingen/inloggen01.gif" width="77" height="28" /></a><br />
<em>Controleer uw gegevens, Caps lock moet uit</em></p>
</form>
</div>
<div id="apDiv4">
<?php
if (isset($_GET['p'])) {
$includebstandtemp = $_GET['p'];
if (is_file($_GET['p'] . '.html')) {
$includebstand = ''.$includebstandtemp.'.html';
}
}
else {
$includebstand = '';
}
if (!empty($includebstand)) {
include($includebstand);
}
?>
<?php if (!isset($_GET['p'])) { ?>
<h1>Welkomstvenster</h1>
<p>Welkom bij de Online HelpDesk van EnergyNet<br />
U vraagt, wij antwoorden<br />
Op deze Online HelpDesk kunt u vragen stellen omtrent de tarieven en de pakketten die wij aanbieden.<br />
Beheer uw eigen gegevens<br />
Wilt u op de hoogte blijven van uw verbruik, uw nota inzien, een verhuizing of de meterstanden doorgeven? Dat kan met uw eigen e-mailadres en wachtwoord. Als u nieuw bent, vult u eenmalig een registratieformulier in.</p>
<?php } ?>
</div>
</div>
</body>
</html>
Code:
@charset "utf-8";
.text {
text-align: center;
font-style: normal;
}
.text {
text-align: center;
}
.text {
text-align: left;
}
.Title {
text-align: left;
}
.tekst {
text-align: left;
}
a:link {
color: #90F;
}
a:visited {
color: #666;
}
a:hover {
font-style: italic;
color: #22FF22;
}
a:focus {
font-style: italic;
color: #22FF22;
}
.e-mail {
color: #696969;
}
#apDiv2 {background: #ffffff;}
#apDiv2 {
position:absolute;
left:12px;
top:117px;
width:206px;
height:468px;
z-index:2;
}
#apDiv3 {background: #ffffff;}
#apDiv3 {
position:absolute;
left:885px;
top:117px;
width:241px;
height:400px;
z-index:3;
}
#apDiv4 {background: #ffffff;} #apDiv4 {
position:absolute;
left:215px;
top:122px;
width:400px;
height:465px;
z-index:4;
}
.Waarschuwing {
}
.Waarschuwing {
}
#Waarschuwing {
font-family: "Arial Black", Gadget, sans-serif;
}
#Waarschuwing {
font-family: "Arial Black", Gadget, sans-serif;
}
.background {
background-image: url(/afbeeldingen/groen-wit.gif);
background-repeat: repeat;
}
#apDiv3 #form1 {
color: #F0F;
}
#apDiv3 #form1 {
color: #90F;
}
body {
margin-left: auto;
margin-right: auto;
background-image: url(../afbeeldingen/groen-wit.gif);
background-repeat: repeat;
width: auto;
background-position: center bottom;
height: auto;
}
