Veröffentlicht 16. Dezember 200618 j 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: Scrollable Table with Fixed Header, repeat print header and footer 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> </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> <!-- end container --> </body> </html> Kann mir da eventuell jemand helfen ?? Danke Gawan
18. Dezember 200618 j browserfensterabhängige höhe kannst du in einem Div-Layout nur mit hilfe von Javascript erreichen. das heist, höhe auslesen, davon den Titel und Footer abziehen und das dann als height in den Container geben. ich benutze ein solches Script recht häufig und habe nur gute erfahrungen damit.
Archiv
Dieses Thema wurde archiviert und kann nicht mehr beantwortet werden.