Der Ansatz ist nicht schlecht - auch wenn man im Moment online noch nicht viel sieht, weil Du für die seitlichen Streifen keine Höhe angegeben hast.
Ich hab mal weitergebastelt - schau es Dir mal an. Dann kannst Du ja mal auf der Basis weiterprobieren - ist auch noch nicht optimal.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Musikverein Herlikofen 1930 e.V.</title>
<meta http-equiv="imagetoolbar" content="no">
<style type="text/css">
<!--
body {background-color:#fff;}
#bigdiv { position:relative;
margin:5% 20% 0 20%;
background:#fff url(Streifenh.gif) repeat-x top;
}
#leftdiv {
background:url(Streifenv.gif) repeat-y 0 0;
}
#rightdiv {
background:url(Streifenv.gif) repeat-y 0 0;
}
#inhalt {
padding-top:100px;
margin:0 190px;
min-height: 400px;
}
*html #inhalt {height:400px;} /*nur für den IE*/
-->
</style>
</head>
<body>
<div id="bigdiv">
[img]purpl012.jpg[/img]
[img]purpl012.jpg[/img]
<br style="clear:both">
<div id="leftdiv">
<div id="rightdiv">
<div id="inhalt">
und hier der Inhalt hin</div>
</div>
</div>
</div>
</body>
</html>
Edit: So müßte es jetzt gehen - hab's noch mal geändert und viel geschachtelt.
Wird immer so hoch wie der Inhalt.
Die genauen Werte bitte selber tüfteln.
Ein Problem gibt es noch:
Bei weniger als 1024px Breite wird der Inhaltsbereich extrem eng - ich würde weniger margin an den Seiten lassen.
Und noch ein Tipp: such Dir einen anderen Hoster. Gibt auch bessere kostenlose Hoster - z.B. Arcor - ist werbefrei.