Thead wird im FF versetzt dargestellt

Computer: Software & Programmierung HTML & CSS
#1

Hallo, liebe w-w-wler,

jetzt habe ich so viele Stunden nach dem Bug gesucht, jetzt muss ich mich an euch wenden…

Also: Es geht hier um eine Table, in der Ergebnisse dargestellt werden.
Der thead und tfoot hat eine farbige Hintergrungsgrafik, die s im tbody haben links und rechts eine Border von 1px mit border-collapse, die thead und foot natürlich nicht haben, sonst sähe die background-Grafik dämlich aus, weil sie abgerundete Ecken hat. Zumindestens haben sie aussen links und aussen rechts keine border, zwischen den s sind zur Abgrenzung schon welche.

Im IE sieht das Ganze merkwürdigerweise gut aus, die Grafik schliesst links bündig mit den borders, im FF ist die Hintergrundgrafik aber um den Pixel der Border nach rechts versetzt, und ich bekomme das einfach nicht weg.

Hier mal ein Auszug aus dem Code, die anderen s habe ich aus Platzgründen weggelassen, sehen aber genauso aus:

URL
Klicks
Details
http://www.somedomain.com/otherdir/otherfile.html
123.123
someBar
34.34%
Details
Summe
1234.234

100%

Die s im head haben alle die gleiche Hintergrundgrafik, die relativ gross ist, damit die Tabellenbreite flexibel ist. Also die linke mit background-position:left, die rechte mit right und die mittlere mit center.
Im tfoot schliesst die Grafik bündig, da ist es aber auch nur eine ganz kleine, die schön wiederholt werden kann, weil diese keine abgerundeten Ecken hat.

Ich hoffe, ich konnte das Problem halbwegs darstellen und jemand kann mir so helfen… ich bin mit meinem Latein am Ende

#2

Hallo Yummi,

du weißt ja, dass IE und andere Browser die Breite eines Elements verschieden berechnen? Sehr wahrscheinlich hängt es damit zusammen? Oder auch nicht…???

Um dir eine Antwort geben zu können, muss man auch die CSS-Formatierung sehen, meinst du nicht?

Gruß,
Maja

#3

TFOOT im Quellcode vor TBODY
Hallo Yummi,

Im IE sieht das Ganze merkwürdigerweise gut aus, die Grafik
schliesst links bündig mit den borders, im FF ist die
Hintergrundgrafik aber um den Pixel der Border nach rechts
versetzt, und ich bekomme das einfach nicht weg.

Ich glaube zwar nicht, dass es damit zusammenhängt, aber in jedem Fall ist die Reihenfolge deiner THEAD-, TBODY- und TFOOT-Elemente falsch. Das TFOOT-Element kommt im Quellcode zwar immer nach dem THEAD-Element, aber vor allen TBODY-Elementen einer Tabelle. Das hätte ja auch sonst keinen Sinn, denn der besteht ja gerade darin, dass der zur Orientierug in den Spalten dienende Abschluss der Tabellenspalten (TFOOT-Element) schon angezeigt wird, während der möglicherweise sehr lange TBODY noch geladen wird.

Die s im head haben alle die gleiche
Hintergrundgrafik, die relativ gross ist, damit die
Tabellenbreite flexibel ist. Also die linke mit
background-position:left, die rechte mit right und die
mittlere mit center.
Im tfoot schliesst die Grafik bündig, da ist es aber auch nur
eine ganz kleine, die schön wiederholt werden kann, weil diese
keine abgerundeten Ecken hat.

Hast du es mal mit border-collapse:collapse und table-layout:fixed für das TABLE-Element versucht? Welchen DOCTYPE benutzt du? Das alles kann einen Heidenunterschied machen, gerade auch bei Tabellen!

Gruß Gernot