<tbody > Problem mit Mozilla Firefox

Status
Nicht offen für weitere Antworten.
R

Romsl

Erfahrenes Mitglied
Hi,

es gibt folgendes Problem. Ich habe eine Tabelle die noch eine Tabelle beinhaltet. Die äußerste Tabelle hat 100% Höhe.

HTML: 
<table height="100%">

</table>

Die innere Tabelle beinhaltet

HTML: 
<thead>
            <tr>
                <th>Col 1</th><th>Col 2</th><th>Col 3</th><th>Col4</th><th>Col 5</th>
            </tr>
        </thead>
        <tbody style="overflow:auto; height:100%; ">
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            ........
        </tbody>

Das Problem hierbei ist, dass ich unten (in der äußeren Tabelle) noch eine NavLeiste habe. Ich möchte jetzt, dass die äußerste Tabelle 100% hat und die innere genau die 100% von der äußeren einnimmt, und falls mehr Datensätze (Zeilen) vorhanden sind eben diese innere gescrollt werden kann.

Das heißt ich habe im Endeffekt auf der Seite eine Tabelle die den restlichen Bildschirminhalt einnimmt und innerhalb eine Scrollable Tabelle.

Danke
 
HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
</head>
<body>
<form method="post" name="bp" action="">
    <table style="overflow:auto; height: 100%; ">
       <tbody style="overflow:auto; height: 100%; ">
       <tr>
          <td>
          <table border="0" cellpadding="0" cellspacing="0" height="100%">
              <thead>
                  <tr>
                      <th>Col 1</th><th>Col 2</th><th>Col 3</th><th>Col4</th><th>Col 5</th>
                  </tr>
              </thead>
              <tfoot>
            
              </tfoot>
              <tbody style="overflow:auto; max-height:100%; ">
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
                  <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>      
         </tbody>
          </table>
          </td>
       </tr>
   </tbody>
</table>
</form>
Leiste
</body>
</html>

MOZILLA FIREFOX.

So sollte es aussehen. In der inneren Tabelle (erzeugt durch Template) ist ein Header angegeben. Das Problem ist jetzt, dass ich den Header aber nicht mitscrollen möchte, sondern er soll oben stehen bleiben. Gibt es eine Möglichkeit dies zu realisieren ohne das Template zu ändern, oder das Template zu ändern ohne Auswirkungen auf bestehende Komponenten zu haben?

Gruß

Romsl
 
Im IE gibts einen Hack dafür, aber im FIREFOX und Konsorten wills nicht gehen. Da muss es doch etwas geben

HTML: 
<STYLE type="text/css" media="screen">
    #container
    {
        border: solid 1px black;
        width: 50%;
        height: 150px;
        overflow: auto;
    }
    .noScroll
    {
        position:relative;
        top:expression(this.offsetParent.scrollTop);
        background-color:white;
        font-family: Arial, Helvetica, sans-serif;
    }
    TH
    {
        text-align: left;
    }
</STYLE>
<div id="container">
    <table border="0" cellpadding="0" cellspacing="0" style="width: 100%">
        <thead>
            <tr class="noScroll">
                <TH>Col 1</TH><TH>Col 2</TH><TH>Col 3</TH><TH>Col 4</TH><TH>Col 5</TH>
            </tr>
        </thead>
        <tbody>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
            <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
        </tbody>
    </TABLE>
</div>
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück