Seite mit CSS funktioniert nicht ganz wie ich will

html.de-Forum HTML, XHTML & CSS
1

Hallo zusammen,

ich hab mir mit ASP und CSS eine Seite gebaut mit der ich Daten aus einer Datenbank abrufe.
Die Seite findet ihr hier:

http://gawan.mine.nu/celebdil/testpage.asp

Mein Problem ist, dass der obere Teil der Seite (also die Überschrift) der gleichen CSS-Definition unterlegen ist wie die untere Datentabelle.
Ich würde mir aber wünschen dass der obere Teil eine fix definierte Höhe hat und die untere Datentabelle den Rest der Seite (unabhängig von der Auflösung) einnimmt.

Der Code der mir die Seite erzeugt sie in etwas so aus:

<link rel="stylesheet" href="stylechris.css" type="text/css">
<style type="text/css">

div.tableContainer {
    width: 100%;        /* table width will be 99% of this*/
    height: 350px;     /* must be greater than tbody*/
    overflow: auto;
    margin: 0 auto;
    }

table {
height: 100px;
    width: 100%;        /*100% of container produces horiz. scroll in Mozilla*/
    border: solid 0px slategray;
    }
    
table>tbody    {  /* child selector syntax which IE6 and older do not support*/
    overflow: auto; 
    height: 300px;
    overflow-x: hidden;
    }
    
thead td    {
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    background-color: papayawhip;
    color: steelblue;
    border-top: solid slategray 0px;
    border-bottom: solid 0px slategray;
    position:relative; 
    top: expression(document.getElementById("data").scrollTop-2); /*IE5+ only*/
    }
    
td    {
    color: #000;
    padding-right: 2px;
    font-size: 12px;
    text-align: right;
    font-family: Arial,sans-serif;
    border-top: solid 0px slategray;
    border-left: solid 0px slategray;
    }

    
    
tfoot td    {
    text-align: center;
    font-size: 11px;
    font-weight: bold;
    background-color: papayawhip;
    color: steelblue;
    border-top: solid 2px slategray;
    }

td:last-child {padding-right: 20px;} /*prevent Mozilla scrollbar from hiding cell content*/

</style>


</head>

<body>


<form name="test" action="testpage.asp" method="get">
<table border="0">
  <tr> 
      <td valign="bottom" align="center">Channel</td>
    <td valign="bottom" align="center">Planner</td>
    <td valign="bottom" align="center">LVL</td>
    <td valign="bottom" align="center">Ordertyp</td>
    <td valign="bottom" align="center">Item Filter</td>
    <td valign="bottom" align="center">CCD Filter</td>
    <td valign="bottom" align="center">Datum bis:</td>
  <td>&nbsp;</td>
  
  </tr>
<tr>
</table>
</form>

<HR ALIGN="LEFT" WIDTH=750 COLOR="#FF0000"> 

<div id="container">

<div class="tableContainer" id="data">
  <table cellspacing="0" border="2">
     <thead>
      <tr> 
        <td >Date1</td>
           <td >Date2</td>
    <td >Date3</td>
    <td >Date4</td>
    <td >Date5</td>
    <td >Date6</td>
        <td >Date7</td>
    <td >Date8</td>
    <td >Date9</td>
    <td >Date10</td>
    <td >Date11</td>
      </tr>
    </thead>
    <tfoot>
      <tr> 
        <td width="100%" colspan="5">Table footer repeats on print</td>
      </tr>

    </tfoot>
    <tbody>
<%
RS.Open "SELECT * FROM traffic;", objConn, 3,3
    Do While Not RS.EOF
        response.write("<TR>")
            For i = 0 to RS.Fields.Count - 1
            tmp_rs=rs(i)
            if tmp_rs="" then 
                    response.write("<TD VALIGN=TOP>&nbsp;</TD>")
        else
            response.write("<TD VALIGN=TOP>" & tmp_rs &  "</TD>")
                end if
        Next
           response.write("</TR>")

            RS.MoveNext
            Loop
RS.Close
objConn.Close

%>
    </tbody>
  </table>

</div>


</div> <!-- end container -->
</body>
</html>

Kann mir da eventuell jemand helfen ??

Danke
Gawan