Das CSS Attribut clear hebt den Effekt von float auf.
Das min-height sorgt beim FF, Opera, ... für die richtige minimale Höhe des Content Bereichs (so hoch wie deine Menü Grafik).
Das height in "* html content" sorgt für die richtige minimale Höhe im IE.
Wenn ich dir einen Tipp geben darf, nimm lieber eine Liste als Menü und keine Grafik. Versetze die Listenelemente mit hintergrundgrafiken von mir aus und lege leere Link-Blöcke drüber die einen entsprechenden Text-Verweis enthalten der allerdings versteckt wird.
/// HTML DATEI
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/transitional.dtd">
<html><head><title>a nightmare before art</title>
<meta http-equiv="language" content="de">
<meta http-equiv="content-Type" content="text/html; charset=iso-8859-1">
<meta name="title" content="~ nightmare before art ~">
<meta name="author" content="Carmen Kratzer">
<meta name="page-topic" content="Private Homepage">
<meta name="robots" content="index,nofollow">
<link rel="stylesheet" type="text/css" href="a%20nightmare%20before%20art-Dateien/test.css"></head><body>
<a name="top"></a>
<div class="box">
<div class="navigation"><img src="a%20nightmare%20before%20art-Dateien/navi.jpg"></div>
<div class="content">
<h1>Prolog</h1>
Die Unvollendete.
Denn ich liebe die Kunst. Ich liebe zu Leben. Endlich.
Viel Vergnügen und/oder ausgiebigen Brechreiz wünscht
C.
</div>
</div>
<div class="footer">© cagedfreedom 2005-2007</div>
<div style="position: absolute; left: 0px; top: 0px; z-index: 1000000; width: 16px; height: 16px; visibility:
hidden;" id="linkalert-box"><img style="position: absolute; left: 0px; top: 0px;"
src="a%20nightmare%20before%20art-Dateien/none-icon.png" id="linkalert-icon"></div></body></html>
/// CSS DATEI
div, td {
color: #808080;
font: 8pt/1.5em Tahoma, Verdana, sans-serif;
}
/* Body-Style */
body {
background: #333;
margin-top: 10px;
text-align: center;
}
/* Spezielle Div- und Span-Styles */
.box {
visibility: visible;
background: #262626;
margin: auto;
width: 600px;
}
.content {
padding: 20px 50px 20px 50px;
min-height:359px;
margin-right: 160px;
text-align: justify;
}
* html content {
height:359px;
}
.footer {
clear:both;
margin-top: 5px;
text-align: center;
letter-spacing: 0.2em;
}
.navigation {
background-image: url(images/bg.jpg);
float: right;
padding: 0;
}
h1 {
color: #808080;
font: bold 10pt Tahoma, Verdana, sans-serif;
letter-spacing: 0.2em;
margin: 15px 0 10px 25px;
padding: 0;
text-align: left;
}