berter: Fragen zur Layout Umsetzung

Beitrag lesen

Hallo zusammen,

vielleicht kann mich jemand auf den richtigen weg bringen.
Ich würde gerne ein Tabellenloses Layout umsetzen.
Oben für Logo + Navigation ein 100% breites und 200px hohes Div.
Darunter 3 gefloatete Divs, jeweils 33% Breite und so hoch wie
die verbleibende Höhe.  Mein Problem besteht in der Höhenangabe des oberen Divs. Setze ich dieses auf 20% und die unteren divs auf 80% Höhe
ist alles bestens. Mit einer Festen Höhenangabe (200px) funktioniert
das aber leider nicht mehr. Bin Ratlos und möchte nicht zu Tabellen oder Frames greifen ...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
<title>Unbenanntes Dokument</title>  
<style type="text/css">  
  
body{margin:0; padding:0}  
  
#container{  
	width:100%;  
	height:100%;  
	}  
#logo{  
	width:100%;  
	height:20%;  
	background-color:#6FF;  
	}  
.Bereich{  
	width:33%;  
	height:80%;  
	background-color:#FC0;  
	float:left;  
	overflow:scroll  
	}  
	  
p{  
	height:1000px;  
	}  
</style>  
</head>  
  
<body>  
<div id="container">  
<div id="logo">logo</div>  
  <div class="Bereich">A<p></p>ende</div>  
  <div class="Bereich">B<p></p>ende</div>  
  <div class="Bereich">C<p></p>ende</div>  
</div>  
</body>  
</html>