Display, table, colspan arbeiten nicht zusammen
Lukas
- html
1 Jonathan
Hallo,
ich habe eine Tabelle, bei der jeder zweite Zeile mit display:none ausgeblendet ist. Durch einen Klick auf einen Link in der darüber liegenden Zeile, wird Zeile 2 sichtbar.
Soweit so gut. Die Tabelle hat nun aber vier Spalten. In Zeile 2 sollen diese in eine verschmolzen werden. Also mit Colspan="4".
Und genau hier kommt der Fehler, wenn ich durch einen Klick auf den Link die Zeile 2 sichtbar mache, wird der Colspan völlig ignoriert. So jedenfalls mit Opera und Firefox. Im IE6 funktioniert das (fast) wie gewollt (fast = Spaltenbreite ändert sich beim sichtbar machen).
Weiß jemand ein Workaround?
Hier ist mal ein Ausschnitt aus meinem Code:
<script language="Javascript" type="text/javascript">
<!--
function task_details(ID) {
if(document.getElementById(ID).style.display == "none") {
document.getElementById(ID).style.display = "block";
}else {
document.getElementById(ID).style.display = "none";
}
}
//-->
</script>
<table style="width:100%; background-color:#000;" cellspacing="1">
<tr style="background-color:#FFF;">
<th>Beginn</th>
<th>Aufgabe</th>
<th>Kommentar</th>
<th>Gruppe</th>
</tr>
<tr style="background-color:#FFF;">
<td style="width:50px;">20.07.2007</td>
<td><a href='#' onClick='task_details(1)'>Test</a></td>
<td>foo</td>
<td>bar</td>
</tr>
<tr id="1" style="background-color:#FFF;display:none;">
<td colspan="4" style="background-color:#DEDEDE; padding-left:20px;">
Kleine Beschreibung....
</td>
</tr>
</table>
Hallo,
Also, erstmal ist "1" keine gültige ID, zweitens ist display:block kein vernünftiger Wert für eine Tabellenzelle. Anständige Browser wollen da display:table-cell.
Jonathan