Layout Problem

Hallo zusammen,
ich möchte meine Seite die zwei Bereiche Menü und Daten unterteilen.
Da ich das Problem schlecht erklären kann habe ich mal eine Testseite
geschrieben in der mein Problem auftritt.

<html>
  <head>
    <title></title>
    <style type="text/css">
      .menu
      {
        position:absolute;
        background-color:#E0E0E0;
        left:0px;
        top:0px;
        width:100px;
        height:100%;
      }
      .data
      {
        position:absolute;
        background-color:#C0C0C0;
        left:120px;
        top:20px;
        width:320px;
        height:1024px;
      }
    </style>
  </head>
  <body>
    <div class="menu">
      Menu
    </div>
    <div class="data">
      Das ist der Datenbereich
    </div>
  </body>
</html>

Wenn nun der Datenbereich größer (höher) ist als das
Browserfenster scrollt das Menü weg. Das tragische
daran ist, dass wieder der <body> zum Vorschein kommt.
Mit einem fixed-Div klappt es ja bei Mozilla nur
woanders halt nicht. Mit fehlt im Moment der Ansatz um
das Problem zu lösen

Ich bin schon fast am Verzweifeln

Bye Peter.

flenders

Ich weiß zwar jetzt nicht so genau, was du damit meinst, dass der "<body> zum Vorschein kommt", aber falls du meinst, dass das DIV von der Navigation nicht so hoch ist wie das content-DIV musst du beide DIVs (evtl. in ein 3. geschachtelt) mit position:relative positionieren, damit sie nebeneinander sitzen brauchst du wohl noch float:left;

Und zu position:fixed ist das hier noch sehr interessant: http://www.fabrice-pascal.de/artikel/posfixedie6/

@flenders,
ich gebe ja zu, dass ich mich etwas komisch /
kompliziert ausgedrückt habe.
float:left ist aber genau das was ich gesucht hatte.
Danke vielmals für die schnelle Hilfe

Bye Peter.