Css breedte aanpassen

Status
Niet open voor verdere reacties.
U

uaejeroen

Terugkerende gebruiker
Lid geworden
7 dec 2009
Berichten
1.665
ik vond
#balk{width: 900px; }
Klik om te vergroten...

Met dit schijnt in elke browser de website evengroot weergeven te worden
ik wil de site in het midden van de browser, en als men het dat de site nog steeds in het midden staat.
Waar moet ik deze code plaatsen, of weet iemand een betere om de site-breedte aante passen?
 
Een oplossing, weet niet waar ik deze moet plaatsen

Code: 
 body {
text-align: center;
}

#main {
width: 720px;
margin: 0 auto;
text-align: left;
}

hieronder mijn css
Code: 
@charset "utf-8";
body {
	background-image: url(../afbeeldingen/groen-wit.gif);
	background-repeat: repeat;
}

.text {
	text-align: center;
	font-style: normal;
}
.text {
	text-align: center;
}
.text {
	text-align: left;
}
.Title {
	text-align: left;
}
.tekst {
	text-align: left;
}
body {

}
body,td,th {
	font-size: 12px;
}
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:32px;
 top:117px;
 width:206px;
 height:468px;
 z-index:2;
}


#apDiv3 {background: #ffffff;}
#apDiv3 {
 position:absolute;
 left:885px;
 top:117px;
 width:241px;
 height:475px;
 z-index:3;
}
#apDiv3 {
	position:absolute;
	left:885px;
	top:110px;
	width:241px;
	height:475px;
	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;
}

hier mijn 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">
#apDiv5 {
	position:absolute;
	left:15px;
	top:13px;
	width:992px;
	height:151px;
	z-index:1;
}
#apDiv6 {
	position:absolute;
	left:33px;
	top:125px;
	width:258px;
	height:507px;
	z-index:2;
}
#apDiv7 {
	position:absolute;
	left:238px;
	top:118px;
	width:542px;
	height:468px;
	z-index:3;
}
#apDiv8 {
	position:absolute;
	left:240px;
	top:119px;
	width:641px;
	height:467px;
	z-index:4;
}
</style>
</head>

<body>
<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="html/algemene_informatie.html">Algemene informatie</a><br />
    <a href="html/tarieven.html">Tarieven</a><br />
    <a href="html/pakketen.html">Pakketten</a><br />
    <img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="html/service.html">Service en onderhoud</a><br />
    <a href="html/energyservice.html">EnergyService</a><br />
    <a href="html/product.html">Productadvies</a><br />
    <a href="html/besparingtips.html">Besparingstips</a><br />
    <img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="html/vraagentwoord.html">Vraag en antwoord</a><br />
    <a href="html/mail.html">Per e-mail</a><br />
    <a href="html/chat.html">Via chat</a><br />
    <img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="html/gegevens.html">Uw gegevens</a><br />
    <a href="html/nota.html">Nota en verbruik</a><br />
    <a href="html/meterstanden.html">Meterstanden doorgeven</a><br />
  <a href="html/verhuizing_doorgeven.html">Verhuizing doorgeven</a></p>
</div>
<div id="apDiv3">
  <p><img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="html/verhuizing_doorgeven.html">Verhuizen, wat nu?</a><br />
    <img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="html/besparingtips.html">Besparingstips</a><br />
    <img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="html/klantenservice.html">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"></div>
</body>
</html>
 
Laatst bewerkt:
uaejeroen zei:
ik vond

Met dit schijnt in elke browser de website evengroot weergeven te worden
ik wil de site in het midden van de browser, en als men het dat de site nog steeds in het midden staat.
Waar moet ik deze code plaatsen, of weet iemand een betere om de site-breedte aante passen?
Klik om te vergroten...

Geef de breedte aan in procenten i.p.v. pixels, dan wordt de breedte in iedere browser goed weergegeven.
 
maar welke code raad u aan?
het is mij niet duidelijk waar ik die code moet plaatsen, en moet ik met een container div werken?
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan