Tabelle layout-problem - Firefox vs. Chrome und IE7

Ich versuche, das layout einer HTML-Tabelle (es sind tabellarische Daten), und es gerendert, Sie in Firefox 3.5 und Chrome 2.0.172 (BEARBEITEN und IE7 - das macht den Tisch wie Chrome).

Habe ich die Tabelle in ein div:

<div id="listcontainer">
  <table class="tasklist">
    <colgroup>
      <col class="narrow" />
      <col class="wide" />
      {{ more column definitions here }}
    </colgroup>
{{ various code here }}
  </table>
</div>

Und ich hab css für das div und Tabelle:

div#listcontainer {
    position: relative;
    float: left;
    width: 98%;
    padding: 0;
    border: 1px;
    overflow-x: scroll;
}

table.tasklist {
    width: auto;
    table-layout: auto;
    border: thin solid;
    font-size: 9pt;
    border-collapse: collapse;
    empty-cells: show;
}

col.narrow {
    min-width: 50px; 
}
col.wide {
    min-width: 200px; 
}

In Firefox, wird die Tabelle breiter macht, als die mit div, und die Bildlaufleiste für die div-ermöglicht dem Benutzer das Blättern über die zusätzlichen Spalten (das ist die beabsichtigte Handlung). Allerdings, Chrome und IE7 angezeigt werden, ignorieren Sie die min-width-Eigenschaft der Spalten und stopft die ganze Tabelle in die mit div. Die nicht, was ich will. Was mache ich falsch?

EDIT: ich die min-width-Elemente auf der th und td Elemente selbst anstelle der Verwendung von colgroup, und dann macht es, wie erwartet, in allen drei Browsern. Mit Spalten, die Kontrolle der Elemente in Chrome zeigt an, dass die berechnet, Stil erbracht hat, die Spaltenbreiten passen innerhalb des div...

Schreibe einen Kommentar