Seite mit CSS funktioniert nicht ganz wie ich will

Gawan

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:

Code

<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></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></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> 
</body>
</html>

Alles anzeigen

Kann mir da eventuell jemand helfen ??

Danke
Gawan[/code]

Tags