ebsite centreren in DW CS %

Status
Niet open voor verdere reacties.

uaejeroen

Terugkerende gebruiker
Lid geworden
7 dec 2009
Berichten
1.665
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">
#apDiv1 {
	position:absolute;
	left:30px;
	top:-5px;
	width:1097px;
	height:116px;
	z-index:1;
}
#apDiv2 {
	position:absolute;
	left:33px;
	top:114px;
	width:258px;
	height:468px;
	z-index:2;
}
#apDiv3 {
	position:absolute;
	left:930px;
	top:115px;
	width:200px;
	height:470px;
	z-index:3;
}
#apDiv4 {
	position:absolute;
	left:293px;
	top:116px;
	width:641px;
	height:467px;
	z-index:4;
}
#apDiv9 {
	position:absolute;
	left:11px;
	top:-17px;
	width:780px;
	height:641px;
	z-index:5;
}
#container {
	position: relative;
}
</style>
</head>

<body>
<div align="left" id="container">
<div id="apDiv1"><a href="index.php"><img src="afbeeldingen/logo_energynet.gif" width="1099" height="112" 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>&nbsp;</p>
  <form id="form1" name="form1" method="post" action="">
    <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" />
<br />
  <em>Controleer uw gegevens</em>
  </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>

Deze website wil ik graag in het midden van de webbrowser geopent
Je kunt met page properties margin aangeven maar dat krijg ik niet wat ik wil

ik wil mijn website 780 px with, hoogte maakt niet uit

verder wil ik dat als men het verkleint dat dan de website mee verkleint

weet iemand hoe ik dit voor elkaar kan krijgen
 
precies

dat bedoel ik.. kunt u me helpen?
 
Laatst bewerkt:
Is even kijken hoor, dit is 1 van de weinige divs die niet in mijn css staan. Omdat hij in mijn require_menu.php bestand staan, maar in css style zou het het volgende worden :

HTML:
div.box
{
background-color: #424242;  /* de achtergrond kleur */
width: 800px;  /* de breedte van de pagina */
margin-left: auto;  /* Zorgt er samen met onderstaande regel voor dat de tekst in het midden komt */
margin-right: auto;
padding: 5px 10px; /* geeft aan hoever onder de bovenste rand, en de zijkant rand de tekst moet beginen */
border-width:3px; /* onderstaande 3 regels zijn voor de border */
border-style:solid; 
border-color: #FFFFFF;
}


Ik hoop dat ik je hier een beetje mee geholpen heb.

Mvg,

Rik
 
Laatst bewerkt:
Geachte Hr Rick

Hartelijk dank voor uw snelle reactie !!!

Maar waar moet ik dit plakken?
ik ben nog geen held in CSS

Graag advies
 
mijn css

HTML:
@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:32px;
 top:117px;
 width:206px;
 height:468px;
 z-index:2;
}
#apDiv2 {
	position:absolute;
	left:22px;
	top:124px;
	width:206px;
	height:468px;
	z-index:2;
}


#apDiv3 {background: #ffffff;}
#apDiv3 {
 position:absolute;
 left:885px;
 top:117px;
 width:241px;
 height:400px;
 z-index:3;
}
#apDiv3 {
	position:absolute;
	left:875px;
	top:122px;
	width:241px;
	height:400px;
	z-index:3;
	color: #F00;
}


#apDiv4 {background: #ffffff;} #apDiv4 {
 position:absolute;
 left:238px;
 top:114px;
 width:645px;
 height:471px;
 z-index:4;
}
#apDiv4 {
	position:absolute;
	left:240px;
	top:115px;
	width:645px;
	height:471px;
	z-index:4;
}


#apDiv1 {
 position:absolute;
 left:32px;
 top:4px;
 width:1095px;
 height:111px;
 z-index:1;
}
#apDiv1 {
 position:absolute;
 left:32px;
 top:4px;
 width:1095px;
 height:111px;
 z-index:1;
}

.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;
}

#apDiv1 {
	position:absolute;
	left:30px;
	top:-5px;
	width:1097px;
	height:116px;
	z-index:1;
}
#apDiv2 {
	position:absolute;
	left:33px;
	top:114px;
	width:258px;
	height:468px;
	z-index:2;
}
#apDiv3 {
	position:absolute;
	left:935px;
	top:115px;
	width:200px;
	height:468px;
	z-index:3;
}
#apDiv4 {
	position:absolute;
	left:293px;
	top:116px;
	width:641px;
	height:467px;
	z-index:4;
}
#apDiv9 {
	position:absolute;
	left:11px;
	top:-17px;
	width:780px;
	height:641px;
	z-index:5;
}
body {
	margin-left: auto;
	margin-right: auto;
	background-image: url(../afbeeldingen/groen-wit.gif);
	background-repeat: repeat;
	width: auto;
	background-position: center center;
	height: auto;
}

#container {
	position: relative;
}
 
uhm je zou hem gewoon helemaal onderin je css kunnen plakken zoals ik hem er heb neergezet.

Op je pagina moet je hem dan als volgt aanroepen :

HTML:
<html>
<head>
</head>
<body>
<div class="box">
hier komt alle inhoud van de website

</div>
en daar eindig je de div weer, pas na al je tekst en inhoud
</body>
</html>
 
Geachte Hr. Rick

Hartelijk dank voor uw advies, er gebeurt alleen wijnig\

hier komen mijn voorbeelden

CSS
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:32px;
 top:117px;
 width:206px;
 height:468px;
 z-index:2;
}
#apDiv2 {
	position:absolute;
	left:22px;
	top:124px;
	width:206px;
	height:468px;
	z-index:2;
}


#apDiv3 {background: #ffffff;}
#apDiv3 {
 position:absolute;
 left:885px;
 top:117px;
 width:241px;
 height:400px;
 z-index:3;
}
#apDiv3 {
	position:absolute;
	left:875px;
	top:122px;
	width:241px;
	height:400px;
	z-index:3;
	color: #F00;
}


#apDiv4 {background: #ffffff;} #apDiv4 {
 position:absolute;
 left:238px;
 top:114px;
 width:645px;
 height:471px;
 z-index:4;
}
#apDiv4 {
	position:absolute;
	left:240px;
	top:115px;
	width:645px;
	height:471px;
	z-index:4;
}


#apDiv1 {
 position:absolute;
 left:32px;
 top:4px;
 width:1095px;
 height:111px;
 z-index:1;
}
#apDiv1 {
 position:absolute;
 left:32px;
 top:4px;
 width:1095px;
 height:111px;
 z-index:1;
}

.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;
}

#apDiv1 {
	position:absolute;
	left:30px;
	top:-5px;
	width:1097px;
	height:116px;
	z-index:1;
}
#apDiv2 {
	position:absolute;
	left:33px;
	top:114px;
	width:258px;
	height:468px;
	z-index:2;
}
#apDiv3 {
	position:absolute;
	left:935px;
	top:115px;
	width:200px;
	height:468px;
	z-index:3;
}
#apDiv4 {
	position:absolute;
	left:293px;
	top:116px;
	width:641px;
	height:467px;
	z-index:4;
}
#apDiv9 {
	position:absolute;
	left:11px;
	top:-17px;
	width:780px;
	height:641px;
	z-index:5;
}
body {
	margin-left: auto;
	margin-right: auto;
	background-image: url(../afbeeldingen/groen-wit.gif);
	background-repeat: repeat;
	width: auto;
	background-position: center center;
	height: auto;
}

#container {
	position: relative;
}
div.box
{
background-color: #424242;  /* de achtergrond kleur */
width: 800px;  /* de breedte van de pagina */
margin-left: auto;  /* Zorgt er samen met onderstaande regel voor dat de tekst in het midden komt */
margin-right: auto;
padding: 5px 10px; /* geeft aan hoever onder de bovenste rand, en de zijkant rand de tekst moet beginen */
border-width:3px; /* onderstaande 3 regels zijn voor de border */
border-style:solid; 
border-color: #FFFFFF;
}

HTML​

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>

<body>
<div align="left" id="box">
<div id="apDiv1"><a href="index.php"><img src="afbeeldingen/logo_energynet.gif" width="1099" height="112" 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>&nbsp;</p>
  <form id="form1" name="form1" method="post" action="">
    <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" />
<br />
  <em>Controleer uw gegevens</em>
  </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>
 
er staat nu

HTML:
<div align="left" id="box">

Maak daar is van

HTML:
<div class="box">

Ik zei ook class en geen ID, en waarom gebruik je een align = left als je hem in het midden wilt?

Mvg

Rik
 
Beste

Als ik daar center zette plaatste die alle tekst in het midden

n
 
Verbeterd geen verandering zichtbaar?

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:32px;
 top:117px;
 width:206px;
 height:468px;
 z-index:2;
}
#apDiv2 {
	position:absolute;
	left:22px;
	top:124px;
	width:206px;
	height:468px;
	z-index:2;
}


#apDiv3 {background: #ffffff;}
#apDiv3 {
 position:absolute;
 left:885px;
 top:117px;
 width:241px;
 height:400px;
 z-index:3;
}
#apDiv3 {
	position:absolute;
	left:875px;
	top:122px;
	width:241px;
	height:400px;
	z-index:3;
	color: #F00;
}


#apDiv4 {background: #ffffff;} #apDiv4 {
 position:absolute;
 left:238px;
 top:114px;
 width:645px;
 height:471px;
 z-index:4;
}
#apDiv4 {
	position:absolute;
	left:240px;
	top:115px;
	width:645px;
	height:471px;
	z-index:4;
}


#apDiv1 {
 position:absolute;
 left:32px;
 top:4px;
 width:1095px;
 height:111px;
 z-index:1;
}
#apDiv1 {
 position:absolute;
 left:32px;
 top:4px;
 width:1095px;
 height:111px;
 z-index:1;
}

.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;
}

#apDiv1 {
	position:absolute;
	left:30px;
	top:-5px;
	width:1097px;
	height:116px;
	z-index:1;
}
#apDiv2 {
	position:absolute;
	left:33px;
	top:114px;
	width:258px;
	height:468px;
	z-index:2;
}
#apDiv3 {
	position:absolute;
	left:935px;
	top:115px;
	width:200px;
	height:468px;
	z-index:3;
}
#apDiv4 {
	position:absolute;
	left:293px;
	top:116px;
	width:641px;
	height:467px;
	z-index:4;
}
#apDiv9 {
	position:absolute;
	left:11px;
	top:-17px;
	width:780px;
	height:641px;
	z-index:5;
}
body {
	margin-left: auto;
	margin-right: auto;
	background-image: url(../afbeeldingen/groen-wit.gif);
	background-repeat: repeat;
	width: auto;
	background-position: center center;
	height: auto;
}

#container {
	position: relative;
}
div.box
{
background-color: #424242;  /* de achtergrond kleur */
width: 780px;  /* de breedte van de pagina */
margin-left: auto;  /* Zorgt er samen met onderstaande regel voor dat de tekst in het midden komt */
margin-right: auto;
padding: 5px 10px; /* geeft aan hoever onder de bovenste rand, en de zijkant rand de tekst moet beginen */
border-width:3px; /* onderstaande 3 regels zijn voor de border */
border-style:solid; 
border-color: #FFFFFF;
}

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>

<body>
<div class="box"> 
<div id="apDiv1"><a href="index.php"><img src="afbeeldingen/logo_energynet.gif" width="1099" height="112" 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>&nbsp;</p>
  <form id="form1" name="form1" method="post" action="">
    <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" />
<br />
  <em>Controleer uw gegevens</em>
  </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>


het kan zijn dat als ik de site upload er wel verandering zichtbaar is, weet u ook hoe ik er voor kan zorgen dat als de paginA verkleint dat de site mee verkeleint?
 
Hmm, lastig.

Misschien dat iemand anders ziet wat hier misgaat?
 
Geachte Hr. Rik
Geen probleem hartelijk dank voor uw tijd !!!

Vr groet Jeroen
 
Er moet geen align in.

Je complete CSS:
Code:
@charset "utf-8";

#container { 
	position: relative;
    width: 780px;
    margin: 0 auto;
}

.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:32px;
 top:117px;
 width:206px;
 height:468px;
 z-index:2;
}
#apDiv2 {
	position:absolute;
	left:22px;
	top:124px;
	width:206px;
	height:468px;
	z-index:2;
}


#apDiv3 {background: #ffffff;}
#apDiv3 {
 position:absolute;
 left:885px;
 top:117px;
 width:241px;
 height:400px;
 z-index:3;
}
#apDiv3 {
	position:absolute;
	left:875px;
	top:122px;
	width:241px;
	height:400px;
	z-index:3;
	color: #F00;
}


#apDiv4 {background: #ffffff;} #apDiv4 {
 position:absolute;
 left:238px;
 top:114px;
 width:645px;
 height:471px;
 z-index:4;
}
#apDiv4 {
	position:absolute;
	left:240px;
	top:115px;
	width:645px;
	height:471px;
	z-index:4;
}


#apDiv1 {
 position:absolute;
 left:32px;
 top:4px;
 width:1095px;
 height:111px;
 z-index:1;
}
#apDiv1 {
 position:absolute;
 left:32px;
 top:4px;
 width:1095px;
 height:111px;
 z-index:1;
}

.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;
}

#apDiv1 {
	position:absolute;
	left:30px;
	top:-5px;
	width:1097px;
	height:116px;
	z-index:1;
}
#apDiv2 {
	position:absolute;
	left:33px;
	top:114px;
	width:258px;
	height:468px;
	z-index:2;
}
#apDiv3 {
	position:absolute;
	left:935px;
	top:115px;
	width:200px;
	height:468px;
	z-index:3;
}
#apDiv4 {
	position:absolute;
	left:293px;
	top:116px;
	width:641px;
	height:467px;
	z-index:4;
}
#apDiv9 {
	position:absolute;
	left:11px;
	top:-17px;
	width:780px;
	height:641px;
	z-index:5;
}
body {
	margin-left: auto;
	margin-right: auto;
	background-image: url(../afbeeldingen/groen-wit.gif);
	background-repeat: repeat;
	width: auto;
	background-position: center center;
	height: auto;
}

#container {
	position: relative;
}

Complete HTML
Code:
<!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>
 
<body>
<div id="container"> 
    <div id="apDiv1"><a href="index.php"><img src="afbeeldingen/logo_energynet.gif" width="1099" height="112" 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>&nbsp;</p>
      <form id="form1" name="form1" method="post" action="">
        <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" />
    <br />
      <em>Controleer uw gegevens</em>
      </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>

Margin werkt sowieso niet als er geen position is meegegeven, dat was volgens mij de reden dat er niets gebeurde.
 
beste

Hartelijk dank !!!
Alleen er veranderd nog steeds niets, ik denk dat ik het maar zo moet laten, tenzij iemand iets anders weet natuurlijk

Groet
jeroen
 
Hoi Jeroen,
Vergis ik me nou, of had je deze vraag ook al op het CSS-gedeelte van het forum geplaatst?
Daar had ik als antwoord gegeven, dat het niet kunnen centreren ligt aan je apDiv's die een absolute positie hebben, en een vaste {left: ..px;} afstand tot de linkerkant van het scherm.
Dan kan je er centreer-containers omheen zetten zoveel als je wilt, maar dan gebeurt er niets. ;)
 
CSSHunter, dit is niet helemaal correct. De ApDivs hebben een Absolute Positie ten opzichte van de parent wat nu een relatieve div is. Heb dit op mijn localhost net allemaal getest en bij mij werkt het gewoon.
 
leuk dat er meer mensen meningen geven maar bij mijn werkt het niet

Grumbkow... kunt u me misschien vertellen hoe ik deze website in het midden krijg??

En csshunter, ja dat klopt, maar ik zoek advies, en op css is er minder publiek ' denk ik zo' dan hier, waardoor ik h ier misschien meer kans op een goed antwoord heb
 
Ik heb je verteld hoe je hem in het midden krijgt zoals het bij mij werkt. Blijkbaar doe je dan toch iets niet goed met de code die ik je heb gegeven.
 
sorry, ik zal morgen wel weer kijken , nu is het hier al weer avond ik verblijf in azië op dit moment,
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan