Perfume: Tabellen im IE

Hallo Ihr Experten,

ich möchte um ein Element unbekannter (und wechselnder) Breite und Größe einen Schatten mittels halbtransparenter PNG-Grafiken anzeigen lassen. Ich habe mich entschieden, dies per Tabelle zu lösen.

Anbei mein Quelltext:

<table id="PopupFrame" class="PopupFrame" border="1" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td colspan="2" rowspan="2" class="PopupContent">
1111111111111111111111<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1</td>
<td class="PopupShadowRightTop"></td>
</tr>
<tr>
<td class="PopupShadowRight"></td>
</tr>
<tr>
<td class="PopupShadowLeftBottom"></td>
<td class="PopupShadowBottom">&nbsp;</td>
<td class="PopupShadowRightBottom"></td>
</tr>
</tbody>
</table>

Firefox und Opera machen alles richtig. Chrome, Safari und IE stellen die Zelle mit der Klasse "PopupShadowRightTop" allerdings immer viel höher (und die Zelle mit der Klasse "PopupShadowRight" entsprechend niedriger) dar, als es gewünscht ist. Ich konnte kein HTML-Attribut und keine CSS-Anweisung finden, die mir die von mir gewünschte Darstellung erlaubt.

Der von mir verwendete Doctype: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Kann mir jemand einen Tip oder Rat geben?

Vielen Dank.

  1. Hi,

    ich möchte um ein Element unbekannter (und wechselnder) Breite und Größe einen Schatten mittels halbtransparenter PNG-Grafiken anzeigen lassen.

    Was genau für einen Schatten?

    Ich habe mich entschieden, dies per Tabelle zu lösen.

    Vielleicht wäre es sinnvoller, das für moderne Browser mittels box-shadow zu lösen, und in Kauf zu nehmen, dass Benutzern älterer Browser dieses optische Gimmick dann vorenthalten bleibt, anstatt dafür die Dokumentstruktur mit einer Tabelle vollzumüllen.

    Firefox und Opera machen alles richtig. Chrome, Safari und IE stellen die Zelle mit der Klasse "PopupShadowRightTop" allerdings immer viel höher (und die Zelle mit der Klasse "PopupShadowRight" entsprechend niedriger) dar, als es gewünscht ist. Ich konnte kein HTML-Attribut und keine CSS-Anweisung finden, die mir die von mir gewünschte Darstellung erlaubt.

    Und ich kann nicht mal ansatzweise entdecken, dass du überhaupt irgendwie versucht hättest, per CSS auf die Höhe der Tabellenzellen irgendeinen Einfluss zu nehmen.

    Kann mir jemand einen Tip oder Rat geben?

    Mache es mit CSS, und nimm in Kauf, das Benutzer älterer Browser es dann etwas weniger „schön“ dargestellt bekommen.
    Oder nutze statt einer Tabelle wenigstens Elemente, die einfacher in der Handhabung sind - bspw., in dem du sie einfach an den entsprechenden Stellen per CSS positionierst.

    MfG ChrisB

    --
    RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
  2. Hallo,

    ich möchte um ein Element unbekannter (und wechselnder) Breite und Größe einen Schatten mittels halbtransparenter PNG-Grafiken anzeigen lassen. Ich habe mich entschieden, dies per Tabelle zu lösen.

    das halte ich für keine besonders gute Idee.

    Firefox und Opera machen alles richtig.

    genauer: so wie Du Dir dies vorstellst. Sie machen's übrigens nicht falsch.

    Chrome, Safari und IE stellen die Zelle mit der Klasse "PopupShadowRightTop" allerdings immer viel höher (und die Zelle mit der Klasse "PopupShadowRight" entsprechend niedriger) dar, als es gewünscht ist.

    Ja, das ist eine erlaubte Interpretation der Spezifikation, siehe dieser Archivbeitrag. Chrome, Safari und IE verhalten sich ebenso korrekt wie Firefox und Opera :-)

    Chris' Vorschlag ist viel besser.

    Freundliche Grüße

    Vinzenz