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>