exserco
Legacy Member
Aan de site-bouwer-specialisten:
ik heb een probleempje met weergave van de ruimte tussen de verschillende div'jes. De footer staat in IE verder weg dan in FF, van de bovenstaande kolom. Als ik bv de rechterkolom (div) langer maak, krijg ik daar hetzelfde probleem zoals dit nu bestaat in de linkerkolom.
Ik zie niet waar het foutje zit maar, IE geeft de code niet correct terwijl FF dit wel doet.
Iemand een oplossing aub?
De html-code:
stijl.css
divstijl.css
ik heb een probleempje met weergave van de ruimte tussen de verschillende div'jes. De footer staat in IE verder weg dan in FF, van de bovenstaande kolom. Als ik bv de rechterkolom (div) langer maak, krijg ik daar hetzelfde probleem zoals dit nu bestaat in de linkerkolom.
Ik zie niet waar het foutje zit maar, IE geeft de code niet correct terwijl FF dit wel doet.
Iemand een oplossing aub?
De html-code:
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>
<link href="css/divstijl.css" rel="stylesheet" type="text/css">
<link href="css/stijl.css" rel="stylesheet" type="text/css">
</head>
<body>
<!--begin container-->
<div id="container">
<!--begin header-->
<div id="header">
Hoofdding
</div>
<!--einde header-->
<!--begin zijkant-a-->
<div id="zijkant-a">
<p>menu-items:<br>
<hr>
item 1<br>
item 2<br>
item 3</p>
</div>
<!--einde zijkant-a-->
<!--begin zijkant-b-->
<div id="zijkant-b">
rechter kolom rechter kolom rechter kolom rechter kolom rechter kolom rechter kolom rechter kolom rechter kolom </div>
<!--einde zijkant-b-->
<!--begin inhoud-->
<div id="inhoud">
<p>Hier komt alle blablabla en de fotootjes, bevindingen, testen en doe nog maar zo'n beetje verder.
En we geven het nog niet op, want we gaan er nog enkele lijntjes zinloze tekst bijzetten om te kijken wat het resultaat wordt dat op het scherm wordt weergegeven. </p>
</div>
<!--einde inoud-->
<!--begin footer-->
<div id="footer">
voeterke, weet nog niet wat....
</div>
<!--einde footer-->
</div>
<!--einde container-->
</body>
</html>stijl.css
Code:
body {
background-image:url(../pics/backgroundbody.gif)
}divstijl.css
Code:
#container {
width: 90%;
border: 1px solid gray;
margin: 5px;
margin-left: auto;
margin-right: auto;
padding: 10px;
}
#header {
padding: 10px;
margin-bottom: 5px;
background-color: rgb(213, 219, 225);
}
#inhoud {
margin-right: 205px;
margin-left: 205px;
margin-bottom: 5px;
padding: 10px;
background-color: gray;
}
#zijkant-a {
float: left;
width: 180px;
margin: 0;
margin-right: 5px;
margin-bottom: 5px;
padding: 10px;
background-color: rgb(213, 219, 225);
}
#zijkant-b {
float: right;
width: 180px;
margin: 0;
margin-left: 5px;
margin-bottom: 5px;
padding: 10px;
background-color: rgb(213, 219, 225);
}
#footer {
clear: both;
margin: 0;
padding: 10px;
background-color: rgb(213, 219, 225);
}