Tabelle fehlerhaft dargestellt in Firefox

[Banshee]

Hallo ins Forum,

bitte habt Nachsicht mit mir, ich schreibe hier zum ersten Mal!

Nun zu meinem Problem, ich habe eine Tabelle gebaut, die im IE und im Chrome vernünftig aussieht, im Firefox jedoch fehlerhaft.

Wärt Ihr so nett und würdet mir helfen, den Fehler zu finden, der ja wahrscheinlich bei mir liegt?

So soll das Ganze aussehen und wird es auch im Chrome (15.0) und IE (8)dargestellt:

So sieht das Ganze im Firefox aus, das Problem sieht man am Feld Test6 und an der rechten Ecke:

Und hier ist der Html-Code, damit Ihr sehen könnt, was ich im Einzelnen drin habe:

Ich danke Euch schonmal im Voraus

Janice

[Banshee]

hier nochmal die richtige Darstellung, sorry:

Danke

Janice

[EKKi]

Mahlzeit Banshee,

Wärt Ihr so nett und würdet mir helfen, den Fehler zu finden, der ja wahrscheinlich bei mir liegt?

Korrekt, das tut er: Zitat 1068

Und hier ist der Html-Code, damit Ihr sehen könnt, was ich im Einzelnen drin habe:

Das ist ein schlechter Witz - oder? HTML-Code als Screenshot ... meinst Du etwa im Ernst, das den jemand abtippt, um das Problem ggf. nachzuvollziehen, wenn Du schon kein Online-Beispiel lieferst?

Du scheinst ja zu glauben, dass die Teilnehmer dieses Forums hier extrem viel Zeit und kein Privat- oder Berufsleben haben.

MfG,
EKKi

[Banshee]

Vielen Dank für Deine freundliche Art, einer Neuen gegenüber... oder ist das deine normaler Umgangston?

Natürlich eine gute Anregung, den Code zu posten, mal sehen ob ich es hinkriege.

Und ehrlich, würde ich über Glauben sprechen wollen, wäre ich im Kirchenforum!

<table width="800" class="problem-leinwand">
<tr>
<th class="cube1-1" colspan="2" rowspan="2">Test 1</th><td class="cube1-2">&nbsp;</td><td class="cube1-3">Test2</td><th class="cube1-4" colspan="3">1-4</th><th class="cube1-7"  rowspan="6">1-7</th>
</tr><tr>
<td class="cube2-2">Test 3</td><td>2-3</td><th rowspan="4" class="cube2-4" colspan="3">Test 4</th>
</tr><tr>
<td class="cube3-1" rowspan="6">3-1</td><th class="cube3-2" rowspan="6">3-3</th><th class="cube3-3" colspan="2" rowspan="2">3-3</th>
</tr><tr>
</tr><tr>
<th width="200" colspan="2" rowspan="6"><img src="_images/platzhalter.jpg" border="0"></th>
</tr><tr>
<th class="cube6-1"  rowspan="6">6-1</th><th class="cube6-2"  colspan="2">6-2</th>
</tr><tr>
<th class="cube7-2"  colspan="3" rowspan="5">Test 5</th>
</tr><tr>
</tr><tr>
<th class="cube9-1" colspan="2" rowspan="2">Test 6</th>
</tr><tr>
</tr><tr>
<td>11-1</td><th class="cube11-2"  colspan="2" rowspan="2">Test 7</th><td>11-4</td>
</tr><tr>
<td>12-1</td><td>12-2</td><td>12-3</td><td class="cube12-4">12-4</td><td>12-5</td><td>12-6</td>
</tr><tr>
<th class="cube13-1"  colspan="2" rowspan="3">Test 8</th><td>13-2</td><td>13-3</td><td>13-4</td><td>13-5</td><td>13-6</td><td>13-7</td>
</tr><tr>
<td>14-1</td><td>14-2</td><td>14-3</td><td>14-4</td><td>14-5</td><td>14-6</td>
</tr><tr>
<td>15-1</td><td>15-2</td><td>15-3</td><td>15-4</td><td>15-5</td><td>15-6</td>
</tr>
</table>

[EKKi]

Mahlzeit Banshee,

Vielen Dank für Deine freundliche Art, einer Neuen gegenüber... oder ist das deine normaler Umgangston?

Ja, ist es - wenn jemand Tabellen zum Gestalten missbraucht und Quellcode als Screenshot zeigt ... egal, ob dieser jemand alt oder neu ist.

Ich persönlich - und nicht nur ich, so viel ist gewiss - würde ein valides Online-Beispiel vorziehen, um mir Dein Problem anzuschauen. Diverse Code-Schnipsel irgendwie zusammenkopieren, um das dann bei mir lokal auszutesten (und nicht zu wissen, ob das dann auch wirklich der Stand ist, der bei Dir Probleme bereitet), halte ich nicht für sinnvoll.

MfG,
EKKi

[Klawischnigg]

Hi there,

Wärt Ihr so nett und würdet mir helfen, den Fehler zu finden, der ja wahrscheinlich bei mir liegt?

Wahrscheinlich liegt der Fehler nicht bei Dir sondern bei Deinen Stylesheet-Klassendefinitionen. Im HTML-Code ist jedenfalls kein Fehler drinnen, bei mir (FF 5.irgendwas, neuester Seamonkey) sieht das Gestelle richtig aus, wenn man den Tableborder auf "1" setzt. Also kann es nur an Deinen Klassendefinitionen liegen...

[banshee]

hallo Klawischnigg,

wärst du so nett und würdest es dir mal anschauen?

danke dir!

/* CSS Document */

body {
background:#404040;
text-align: center;
font-size:16px;
font-family:arial;
color:#ffffff;
margin:0;
padding:0;
}

.problem-leinwand {
background:#ffffff;
width:800px;
text-align: center;
text-valign: middle;
font-size:16px;
font-family:arial;
color:#000000;
margin:0px;
padding:0px;
}

.cube1-1 {
background:#014FFF;
font-family:arial;
text-align: center;
text-valign: middle;
color:#ffffff;
font-size:48px;
}

.cube1-2 {
background:#FFFFFF;
font-family:arial;
text-align: center;
text-valign: middle;
color:#000000;
font-size:20px;
}

.cube1-3 {
background:#FFC001;
font-family:arial;
text-align: center;
text-valign: middle;
color:#FFFFFF;
font-size:32px;
}

.cube1-4 {
background:#FFFFFF;
font-family:arial;
text-align: center;
text-valign: middle;
color:#000000;
font-size:20px;
}

.cube1-7 {
background:#000080;
font-family:arial;
text-align: center;
text-valign: middle;
color:#FFFFFF;
font-size:20px;
}

.cube2-2 {
background:#000000;
font-family:arial;
text-align: center;
text-valign: middle;
color:#FFFFFF;
font-size:20px;
}

.cube2-4 {
background:#D20404;
font-family:arial;
text-align: center;
text-valign: middle;
color:#FFFFFF;
font-size:24px;
}

.cube3-1 {
background:#dddddd;
font-family:arial;
text-align: center;
text-valign: middle;
color:#FFFFFF;
font-size:12px;
}

.cube3-2 {
background:#FFFFFF;
font-family:arial;
text-align: center;
text-valign: middle;
color:#000000;
font-size:12px;
}

.cube3-3 {
background:#808080;
font-family:arial;
text-align: center;
text-valign: middle;
color:#FFFFFF;
font-size:24px;
}

.cube6-1 {
background:#FFFFFF;
font-family:arial;
text-align: center;
text-valign: middle;
color:#000000;
font-size:20px;
}

.cube6-2 {
background:#FFFFFF;
font-family:arial;
text-align: center;
text-valign: middle;
color:#000000;
font-size:20px;
}

.cube7-2 {
background:#808080;
font-family:arial;
text-align: center;
text-valign: middle;
color:#FFFFFF;
font-size:24px;
}

.cube9-1 {
background:#000080;
font-family:arial;
text-align: center;
text-valign: middle;
color:#FFFFFF;
font-size:24px;
}

.cube11-2 {
background:#ff0000;
font-family:arial;
text-align: center;
text-valign: middle;
color:#FFFFFF;
font-size:36px;
}

.cube12-4 {
background:#dddddd;
font-family:arial;
text-align: center;
text-valign: middle;
color:#FFFFFF;
font-size:12px;
}

.cube13-1 {
background:#9B030F;
font-family:arial;
text-align: center;
text-valign: middle;
color:#FFFFFF;
font-size:24px;
}

table {
  border-collapse: collapse;
  border-spacing: 12px 12px;
  border: 8px solid black;
}
td { border: 12px solid black; }
th { border: 12px solid black; }

a.anker-menu:hover {
color:#FF893B;
text-decoration:none;
font-size:16px;
font-family:arial;
display: block;
padding-top:10px;
padding-right:10px;
padding-bottom:8px;
}

a.anker-menu {
color:#000000;
text-decoration:none;
font-size:16px;
font-family:arial;
display: block;
padding-top:10px;
padding-right:10px;
padding-bottom:8px;
}

.text {
padding-top:06px;
padding-right:36px;
padding-left:36px;
padding-bottom:16px;
margin-left:6px;
margin-top:6px;
width:600px;
display:block;
}

a:hover {
color:#FF3101;
font-weight:bold;
text-decoration:none;
}

a {
color:#ffffff;
font-weight:bold;
text-decoration:underline;
}

.bold60 {
font-size:60px;
font-weight:bold;
display:inline;
color: #FFFFFF;
text-decoration:none;
}

.bild-start {
float: left;
margin-right: 12px;
margin-left: 4px;
margin-bottom: 12px;
margin-top: 12px;
padding:12px;
}

[Klawischnigg]

hallo Klawischnigg,

wärst du so nett und würdest es dir mal anschauen?

Tja, am Stylesheetwesen wird die Welt genesen... meine Euphorie über Deinen richtigen HTML-Code war leider verfrüht, mit Deinen Stylesheetangaben findet sich eine Spur (hätte man mit Validator auf draufkommen können), daß Deine Gestellkonstruktion leider Fehler enthält. Du hast mehrere "leere" Zeilen gesetzt, das ist so nicht valide und vermutlich auch der Grund, warum das in Gecko-Browsern nicht richtig dargestellt wird.

Was hast Du überhaupt vor mit dieser Konstruktion und warum machst Du das mit einer Tabelle? UU wäre es besser, hier mit Elementen zu arbeiten, die absolut positioniert werden...

[Banshee]

hallo Klawischnigg,

was meinst du mit "leeren Zeilen", irgendwie stehe ich gerade auf der leitung..

ich danke dir für deine freundliche hilfe

mit bestem gruß

janice

[Klawischnigg]

Hi there,

was meinst du mit "leeren Zeilen", irgendwie stehe ich gerade auf der leitung..

in Deiner Tabellenkonstruktion lassen sich einige Male die Zeileangaben <tr></tr> finden. Das ist so nicht valide; mit <tr> werden Zeilen definiert und die müssen Zellen enthalten. Kann gut sein, daß das der Grund ist, warum der FF herumzickt...

[Banshee]

in Deiner Tabellenkonstruktion lassen sich einige Male die Zeileangaben <tr></tr> finden.

hallo Klawischnigg,

das entsteht durch die colspan und rowspan-geschichten, in diesem fall muss man trotzdem die <tr>-tags setzen, nur die <td>'s fallen weg, weil sie durch rowspan und colspan ersetzt wurden.

würde man das <tr></tr> weglassen, bzw. <td>'s reinschreiben, würde es rein mathematisch nicht aufgehen.

damit hatte ich noch nie probleme..

mit bestem gruß

banshee

[Gunnar Bittersmann]

@@Banshee:

nuqneH

das entsteht durch die colspan und rowspan-geschichten,

Die widerum entstehen durch den Missbrauch von 'table'.

würde man das <tr></tr> weglassen, bzw. <td>'s reinschreiben, würde es rein mathematisch nicht aufgehen.

Dann stimmt deine Mathematik nicht. 'tr' muss (in HTML 4.01/ XHTML 1.x) mindestens ein 'td'/'th' enthalten. So steht’s in der Spec.

Qapla'

[ChrisB]

Hi,

in Deiner Tabellenkonstruktion lassen sich einige Male die Zeileangaben <tr></tr> finden.

das entsteht durch die colspan und rowspan-geschichten, in diesem fall muss man trotzdem die <tr>-tags setzen, nur die <td>'s fallen weg, weil sie durch rowspan und colspan ersetzt wurden.

Das ist Unfug.
rowspan und colspan geben an, über wie viele Zeilen oder Spalten eine Zelle gestreckt werden soll.

Du kannst eine Zelle aber nicht strecken, wenn du diese eine Zelle komplett weglässt.

würde man das <tr></tr> weglassen, bzw. <td>'s reinschreiben, würde es rein mathematisch nicht aufgehen.

Gar keine Zelle anzugeben, geht logisch nicht auf.

damit hatte ich noch nie probleme..

Ahc, und was genau diskutieren wir hier gerade, wenn nicht dein Problem mit deiner Tabelle …?

MfG ChrisB

[Banshee]

hallo chris,

auch dir vielen dank für die hilfe, da war ich etwas auf dem falschen weg

mit bestem gruß

janice

[Klawischnigg]

Hi there,

Zu all dem bereits Gesagten:

das entsteht durch die colspan und rowspan-geschichten, in diesem fall muss man trotzdem die <tr>-tags setzen, nur die <td>'s fallen weg, weil sie durch rowspan und colspan ersetzt wurden.

Du kannst Tabellenzellen nur dann durch rowspan und colspan "ersetzen", wenn an dieser Stelle logisch welche zu erwarten wären. Eine Zelle aber ist immer zu setzen.

würde man das <tr></tr> weglassen, bzw. <td>'s reinschreiben, würde es

rein mathematisch nicht aufgehen.

Mit Mathematik hat das aber nichts zu tun.

damit hatte ich noch nie probleme..

sieht aber irgendwie nicht so aus. Wie gesagt, ich weiss nicht, ob das der Grund für Deine Probleme ist (was aber gut möglich wäre, der IE verzeiht Fehler eben viel besser als der FF), aber solange das nicht geklärt ist, hat es überhaupt keinen Sinn, nach einem anderen zu suchen. Aber wie ebenfalls schon gesagt, ich weiss auch nicht, was Du mit dieser Tabellenkonstruktion vorhast, aber imho "schreit" dein Konstrukt geradezu nach anderen und vor allem anders positionierten Elementen als nach einer Tabelle, die zudem nur im Drecksbrowser richtig dargestellt wird, wenn sie mit fehlerhaften Angaben aufgebaut wird...

[Banshee]

hallo Klawischnigg,

vielen dank für die hilfe, ich oute mich als dinosaurier... wäre es nur der IE gewesen, wäre es mir auch klar gewesen, aber weil der chrome es auch darstellte, das hat mich auf die falsche fährte gesetzt!

vielen dank für deine geduld und wirklich tolle hilfe

mit bestem gruß

janice