Tabelle, Abstand zwischen den Zellen.

[Jan]

Hallo,

ich wollte Text in einer Tabelle auf klick ein und ausblenden, von der technischen Seite her funktioniert das reibungslos, nur gibt es beim Design noch Probleme.

Und zwar wenn ich das div-Tag ausblende, stellt "ie" das leere table row als 1px spacer da. Mozilla und Co zeigen den Leeraum nicht an.

css (seperate Datei):

.stellenTable{
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
width:400px;
border-spacing:0;
}

.stellenHeader{
padding-left:20px;
text-align:left;
height:22px;
font-weight: bold;
color:#FFFFFF;
cursor:hand;
cursor:pointer;
background-repeat:no-repeat;
background-image:url(../img/verlauf_auf.jpg);
}

.stellenMain{
padding:5px;
text-align:left;
line-height:18px;
background-image:url(../img/verlauf_main.jpg);
background-repeat:repeat-y;
display:none;
}

.stellenFooter{
line-height:5px;
vertical-align:top;
background-image:url(../img/verlauf_footer.jpg);
background-repeat:no-repeat;
}

.stellenStandort {
font-size: 10px;
color: #CDCDCD;
}

Hier der Code:

<table class="stellenTable" width="400" border="0" cellpadding="0" cellspacing="0">
  <tr onclick="showContent('1');">
   <td id="2" class="stellenHeader">Headline</td>
  </tr>
  <tr>
   <td><div id="1" class="stellenMain">Text....</div></td>
  </tr>
  <tr>
   <td class="stellenFooter" valign="top">&nbsp;</td>
  </tr>
</table>

Vielen Dank für eure Hilfe.

Mfg Jan

[Ingo Turski]

Hi,

dieser Code ist in diesem Fall irrelevant, da er weder leere Zellen zeigt noch wie Du Inhalte ausblendest.

<td class="stellenFooter" valign="top">&nbsp;</td>

ist jedenfalls nicht leer und die Zelle würde angezeigt werden auch ohne empty-cells.

freundliche Grüße
Ingo

[Ingo Turski]

Hi,

dieser Code ist in diesem Fall irrelevant

oops ... wo habe ich bloß überall nicht hingeschaut. ;-)
Dennoch kannst Du meiner Antwort eine mögliche Lösung entnehmen.

freundliche Grüße
Ingo

[MudGuard]

Hi,

ich wollte Text in einer Tabelle auf klick ein und ausblenden, von der technischen Seite her funktioniert das reibungslos, nur gibt es beim Design noch Probleme.

Und zwar wenn ich das div-Tag ausblende, stellt "ie" das leere table row als 1px spacer da. Mozilla und Co zeigen den Leeraum nicht an.

Wenn Du eine Zeile ausblenden willst, warum blendest Du ein div aus?

<table class="stellenTable" width="400" border="0" cellpadding="0" cellspacing="0">
  <tr onclick="showContent('1');">
   <td id="2" class="stellenHeader">Headline</td>

id-Werte müssen mit einem Buchstaben (a-zA-Z) anfangen.
stellenHeader klingt nach th ohne Klasse statt nach td mit Header-Klasse.

<td><div id="1" class="stellenMain">Text....</div></td>

s.o. - ungültige ID.

cu,
Andreas