[OPGELOST] footer naar beneden
Posted: Mon Mar 30, 2009 3:27 pm
Op de website http://www.dorpsraadkruiningen.nl/index.php heb ik een footer geplaatst.
Helaas komt hij niet onderaan te staan. Tevens krijg ik het niet voor elkaar om de rechterbalk ook tot aan onderen te laten lopen.
Wat doe ik fout?
Hieronder het sjabloon:
en hier de CSS:
Helaas komt hij niet onderaan te staan. Tevens krijg ik het niet voor elkaar om de rechterbalk ook tot aan onderen te laten lopen.
Wat doe ik fout?
Hieronder het sjabloon:
Code: Select all
<!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" xml:lang="en">
<head>
<title>{sitename} - {title}</title>
{metadata}
{stylesheet}
</head>
</__body>
<div id="container">
<div id="header"></div>
<div id="column_left">
<div id="menu">{menu template="dorpsraadkruiningen" collapse="1"}</div>
</div>
<div id="content"><h1>{title}</h1>{content}<br/></div>
<div id="column_right">
<div id="foto"> Hier komt de foto </div>
<div id="content_links">{content block="Sidebar"}</div>
</div>
</div>
<div id="footer">{global_content name="footer"}</div>
<__body>
{cms_module module="statistics"}
</__html> Code: Select all
*{margin:0; padding:0;}
body {
font-family: verdana, Verdana, Sans-serif;
font-size: 11px;
background-color:#FFF;
padding:0px;
}
#container{
position: relative;
width: 988px;
height: 100%;
margin-left: auto;
margin-right: auto;
margin-top: 10px;
}
#header{
position: absolute;
left: 0px;
top: 0px;
width: 988px;
height: 165px;
background-image: url('http://www.dorpsraadkruiningen.nl/uploads/images/template/header.jpg');
}
#wrapper {overflow:hidden; background:#FFF;}
#column_left{
position: absolute;
left: 0px;
top: 165px;
width: 203px;
height: 500px;
background-color: #f9cd2c;
border-right: solid 1px #48a218;
}
#content{
position:absolute;
left: 204px;
top: 165px;
width: 511px;
margin: 10px;
min-height: 500px;
}
#column_right{
position: relative;
left: 714px;
top: 165px;
width: 273px;
min-height: 100%;
background-color: #f9cd2c;
border-left: solid 1px #48a218;
}
#menu{
padding-top: 20px;
width: 182px;
padding-left: 10px;
}
#foto{
padding-top: 20px;
margin-left: 3px;
width: 264px;
height: 197px;
border: solid 1px #000;
}
#content_links{
padding-top: 10px;
margin-left: 3px;
width: 264px;
min-height: 100%;
}
#wrapper {overflow:hidden; background:#FFF; display:inline-block;}
a{
text-decoration: none;
color: #48a218;
}
a:hover{
text-decoration: underline;
}
img a{
border: none;
}
#footer {
clear:both;
color: #000;
background-color: #FFF;
}
#footer p {
font-size: 0.7em;
padding: 0.1em;
text-align: center;
margin:0;
}
#footer p a {
color: #000;
}
.content {padding:10px;}
h1 {font-size:20px; margin:0; padding:10px 0; color:#0076ac;}
h3 {font-size:18px; margin:0; padding:8px 0;}
#footer p,
#header p {color:#000;}
#footer a {color:#000;}
#footer a:hover {text-decoration:none;}
/* Fonts */
h1 {
font-size: 1.3em;
font-weight: bold;
color: #48a218;
}
h2 {
font-size: 1.3em;
font-weight: bold;
color: #48a218;
}