✔ Problem mit Tabellen und Mozilla

[Quaese]

Hi,

mein Lösungsvorschlag:

<div style="width: 630px; background-color: #000000;">
<table style="width: 620px; margin: 5px; color: #AFAFAF;" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td style="width: 5px; border-bottom: 1px solid #334C33;"><div class="dummyDiv">&nbsp;</div></td>
        <td style="border-bottom: 1px solid #334C33; font-size: 8pt;">
            <div style="float: right; width: 50%; text-align: right;">24.10.2004 - 22:04 Uhr von</div>
            test
        </td>
        <td style="width: 5px; border-bottom: 1px solid #334C33;"><div class="dummyDiv">&nbsp;</div></td>
    </tr>
    <tr>
        <td style="width: 5px; border-bottom: 1px solid #334C33;"><div class="dummyDiv">&nbsp;</div></td>
        <td style="border-bottom: 1px solid #334C33; background-color: #3F3F3F; padding: 10px 12px 12px 12px; color: #008030;">test</td>
        <td style="width: 5px; border-bottom: 1px solid #334C33;"><div class="dummyDiv">&nbsp;</div></td>
    </tr>
    <tr>
        <td style="width: 5px;"><div class="dummyDiv">&nbsp;</div></td>
        <td style="font-size: 8pt;">
            <div style="float: right; width: 50%; text-align: right;">Kommentare (20)</div>
            Quelle:
        </td>
        <td style="width: 5px;"><div class="dummyDiv">&nbsp;</div></td>
    </tr>
</table>
</div>

Das Ganze ist nur noch eine einzige Tabelle mit drei Spalten.

Der rechtsbündige Text oben und unten wurde mit DIVs realisiert, die mit float: right
entsprechend positioniert wurden.

Die Bereiche mit der Klasse .dummyDiv dienen lediglich dazu, Inhalt zu schaffen, ohne
in das Layout einzugreifen. Würde ein Leerzeichen alleinestehend eingefügt werden, so wäre
die dessen Höhe die Zeilenhöhe vergrössern und somit das Layout stören.

.dummyDiv{ font-size: 1px;
           line-height: 0px;
           height: 0px;}

Schau's Dir einfach mal an.

Ciao
Quaese

 

[Scared]

Hmm....danke für die Mühe aber das scheint noch weniger zu gehen.

Hab's mal übernommen und jetzt sind die überschrift "test" und das datum nicht mehr auf einer höhe. nur das datum ist noch mit der linie bündig.
beim netscape kommt dann noch dazu das er dort die 5px abstände von dem inneren bereich total ignoriert und den bereich genauso breit macht wie die beiden linien.
Das gibt's doch nicht grml

 

[Quaese]

Hi,

kleine Anzeigeprobleme gibt es noch in Mozilla und Netscape - dort muss in der Klasse
dummyDiv der Wert height: 1px; gesetzt werden. Dann rückt er auch die 5 Pixel rechts
und links ein.

Ansonsten funktioniert das bei mir wunderbar (IE 4, 5.01, 5.5, 6, Opera 7.22, Netscape 7.1,
Mozilla 1.6, Firefox 0.9.1).

Ich habe Dir die gesamte Datei mal in den Anhang gepackt.

Ciao
Quaese

 

[Scared]

Jap, hast ja Recht!

GEEEEEEEEEEEEEEEEEEEEHHHHHHHHHTTTTTTTTTTTT, DER HAMMER!

ICh Dummkopf hab die div elemente an eine etwas andere stelle gemacht weil ich dachte das dürfte nx ändern und vom code her fand ich's dadurch übersichtlicher :-(

Danke für die super Hilfe!