Ik ben bezig mijn site "liquid" aan het maken, en nu zit ik met een probleem.
Ik wil dat mijn footer gewoon recht onder mijn content div komt. Dit werkt op alles pagina's perfect, behalve op "home" waar ik 2 keer position: absolute; gebruik binnen de content.
Je kan relative en absolute niet gaan mengen, of dat is mijn ervaring toch^^
Nu voor je pagina code (vb met de standaard index):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Steven Hack - Website</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="author" content="Steven Hack">
<meta name="keywords" content="Steven, Hack, Personal, Website, Webdesign, Tilburg, Noord, Brabant, Holland">
<meta name="description" content="Website of Steven Hack.">
<meta name="robots" content="all">
<link href="Steven/style.css" rel="stylesheet" type="text/css" media="screen">
<script src="Steven/javascript.js" type="text/javascript"></script>
<!--[if lt ie 8]>
<style type="text/css" media="screen">
#navbar li {display: inline;}
</style>
<![endif]-->
</head>
<body>
<div id="body">
<div id="header">
</div>
<div id="middle">
<ul id="navbar">
<li><a class="menuitem" href="/">Home</a></li>
<li><a class="menuitem" href="">Projects</a></li>
<li><a class="menuitem" href="">Webdesign</a></li>
<li><a class="menuitem" href="">School</a></li>
</ul>
<div id="content">
<ul id="postlist">
<li><span class="posttitel"><a href="javascript:;" onclick="ShowPost('ajax=true&item=1');">Welcome to my Website</a></span></li>
<li><span class="posttitel"><a href="javascript:;" onclick="ShowPost('ajax=true&item=2');">Project Ideas</a></span></li>
<li><span class="posttitel"><a href="javascript:;" onclick="ShowPost('ajax=true&item=3');">AJAX</a></span></li>
</ul>
<div id="postlistcontent">
Welcome at this new site. I came on this idea because i wanted to make a new site layout,
but I couldn't think of anything to make. So i thought about making a digital portfolio.
After finishing most of the layout i found it pretty cool, so now i use it as my site layout!
</div>
</div>
</div>
<div id="footer"></div>
<ul id="navbar">
<li><a class="menuitem" href="/">Home</a></li>
<li><a class="menuitem" href="">Sitemap</a></li>
<li><a class="menuitem" href="">Disclaimer</a></li>
<li><a class="menuitem" href="">Contact</a></li>
</ul>
</div>
</body>
</html>
Deze code is al heel wat mooier en leest makkelijker.
Maak altijd voor een mooie geordende structuur en je zal je fouten veel makkelijker vinden ;)
Ik snap niet wat je bedoelt dat ik mijn code niet goed orden, het is toch allemaal goed getabed. En betreft de css, die staat gewoon in volgorde van boven naar onder / links naar rechts. Lijkt me ook gewoon goed geordent?
Wat betreft je oplossing: Hier had ik ook al naar gekeken, alleen wanneer ik beide "sub-contents" position: relative; geef, komen ze onder elkaar te staan.
Overigens is absolute en relative wel degelijk te mengen. Als je namelijk een div absolute wil laten positioneren vanuit een andere div (container) moet die container relative zijn.
