Abstand zwischen Bild und Text

[EGOist]

Tag Leute!

Bin hier grad fleissig am Scripten. Jetzt hab ich ein Problem: Ich möchte den Abstand vom Bild zum Text festlegen. Mit ab IE5 und Opera kein Problem, nur Netscape4 will den Abstand nicht darstellen. Würde mich ja damit abfinden, nur mit Netscape4 soll die Seite laut Kunde auch noch anschaubar sein.

Hier mal der Code:
<img class="newsBild" src="bild" align="left" hspace="0">
<span class="newsText">Text</span>

Die CSS-Klasse:
.newsBild { margin-top: 0px; margin-right: 10px; margin-bottom: 10px;  margin-left: 0px;}

Danke im Voraus für Eure Hilfe.

[Stefan Einspender]

Hallo,

Würde mich ja damit abfinden, nur mit Netscape4 soll die Seite laut Kunde auch noch anschaubar sein.

Inwieweit ist die Seite nicht mehr anschaubar, wenn Details wie z.Bsp.
Abstände nicht stimmen? Ist der Kunde sich bewußt, dass Netscape 4.x
heute nur noch von sehr wenig Leuten benutzt wird (schließlich ist der
Browser immerhin mehr als sechs Jahre alt) und ist er bereit, den Auf-
wand für erforderliche Mehrarbeiten zu bezahlen?

Hast Du Dir bzw. dem Kunden diese Fragen gestellt?

Viele Grüße,
Stefan

PS: Es wäre hilfreich, wenn Du den kompletten relevanten Quelltext
    postest, die zwei Zeilen HTML und eine Zeile CSS sind zuwenig.

[EGOist]

Inwieweit ist die Seite nicht mehr anschaubar, wenn Details wie z.Bsp. Abstände nicht stimmen?

Das sieht dann so: Mit IE & Co. seh ich nen Abstand zwischen Bild und Text von 10 Pixeln. Mit N4 sitzt der Text direkt am rechten Bildrand.

Hast Du Dir bzw. dem Kunden diese Fragen gestellt?

Ja, aber wir kommen nicht drum rum, da fast 1000 PCs im Betrieb noch den N4 verwenden.

PS: Es wäre hilfreich, wenn Du den kompletten relevanten Quelltext
    postest, die zwei Zeilen HTML und eine Zeile CSS sind zuwenig.

Imo nicht nötig. Aber wenn du drauf bestehst:
<table layout="fixed" width="355" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
   <td height="20">Berufe</td>
</tr>
<tr>
  <td valign="top"><img class="newsBild" src="bild.jpg" width="150" height="120" vspace="0" hspace="0" align="left"><span class="newsText">Einiges an Text.</span></td>
</tr>
</table>

[Siechfred]

Guten Morgen,

[...]
  <td valign="top"><img class="newsBild" src="bild.jpg" width="150" height="120" vspace="0" hspace="0" align="left"><span class="newsText">Einiges an Text.</span></td>

Vielleicht so (wenn's schon Tabellen sein müssen):
<td><img src="..." style="width:bildbreite+10px; ..."></td>
<td>Dein Text</td>

Viele Grüße
Torsten

[Siechfred]

Guten Morgen,

Vielleicht so (wenn's schon Tabellen sein müssen):
<td><img src="..." style="width:bildbreite+10px; ..."></td>

^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Natürlich muss die _Bildzelle_ die Breite bildbreite+10px bekommen, nicht das Bild selber. Zusätzlich wäre imho noch ein text-align:left für die Zelle nötig.

Viele Grüße
Torsten

[Stefan Einspender]

Hallo Torsten,

Natürlich muss die _Bildzelle_ die Breite bildbreite+10px bekommen, nicht das Bild selber.

Hm ... ist natürlich die Frage, inwieweit Netscape 4.x die Festlegung
einer Tabellenzellenbreite per CSS unterstützt. Außerdem halte ich die
Variante für nicht praktikabel, da hier ja auch noch margin-bottom er-
setzt werden muß, da kommt am Ende ein Riesendurcheinander raus, eine
Tabelle unübersichtlicher als die nächste ;-)

Zusätzlich wäre imho noch ein text-align:left für die Zelle nötig.

Ist die Standardeinstellung in jedem mir bekannten Browser, der die
Anzeige des table-Elementes unterstützt.

Viele Grüße,
Stefan

[Siechfred]

Hallo Stefan,

Hm ... ist natürlich die Frage, inwieweit Netscape 4.x die Festlegung
einer Tabellenzellenbreite per CSS unterstützt.

Laut SelfHTML unterstützt NN 4.x grundsätzlich sowohl width als auch text-align.

Außerdem halte ich die Variante für nicht praktikabel, da hier ja auch noch margin-bottom ersetzt werden muß, da kommt am Ende ein Riesendurcheinander raus, eine Tabelle unübersichtlicher als die nächste ;-)

Soweit ich bisher mitbekommen habe, wird es meistens etwas komplizierter/unübersichtlicher, wenn man NN 4.x-konformes CSS schreiben will ;-)

Vielleicht sollte ich wirklich wieder den NN 4.72 installieren, nur so zum Testen. Weiß jemand, ob es da Probleme unter WinXP geben könnte (irgendwelche Konflikte mit neueren Browsern)?

Viele Grüße
Torsten

[Stefan Einspender]

Hallo,

Inwieweit ist die Seite nicht mehr anschaubar, wenn Details wie z.Bsp. Abstände nicht stimmen?

Das sieht dann so: Mit IE & Co. seh ich nen Abstand zwischen Bild und Text von 10 Pixeln. Mit N4 sitzt der Text direkt am rechten Bildrand.

Nach wie vor verstehe ich nicht, was daran nicht "anschaubar" sein
soll. Es sieht vielleicht nicht besonders gelungen aus, aber wirk-
lich schwerwiegend ist es imho nicht.

Ja, aber wir kommen nicht drum rum, da fast 1000 PCs im Betrieb noch den N4 verwenden.

</faq/#Q-07d> gibt es nicht ohne Grund ...

layout="fixed"

Ein HTML-Attribut layout gibt es nicht.

Ansonsten kann ich Dir leider im Moment nicht weiterhelfen, da ich
hier keinen Netscape 4.x zum Testen habe und die Eigenschaften des
Museumsbrowsers auch nicht auswendig kenne ;-)

Eine Reduzierung auf einen kleinstmöglichen Testfall sollte jedoch
die Frage klären können, ob und wieweit Netscape 4.x die CSS-Eigen-
schaft margin für das imho-Element unterstützt. Die Mischung von
HTML und CSS sowie die gehäufte Verwendung von CSS-Klassen finde
ich ungünstig, solltest Du nach Möglichkeit vermeiden.

Einfacher Test:

<html><head><title>test</title><body><p><img alt="" src="bild.png" style="float:left;margin-right:100px;" align="left">123</p></body></html>

Viele Grüße,
Stefan

[Ingo]

hi,
wenn's nicht unbedingt exakt 10px sein müssen:
nimm statt margin ein oder mehrere (je nach textgröße) whitespaces - das versteht auch der ns4...
gruß
Ingo

[Stefan Einspender]

Hallo Ingo,

wenn's nicht unbedingt exakt 10px sein müssen:
nimm statt margin ein oder mehrere (je nach textgröße) whitespaces - das versteht auch der ns4...

Würde mich interessieren, wie man damit margin-bottom:10px; ersetzen
kann ...

Sorry, aber Dein Vorschlag ist Unfug, da wäre es schon fast besser,
ihm die Verwendung einer Gesamtgrafik (also inkl. dem Text) vorzu-
schlagen, da hat man dann auch pixelgenaues Layout in jedem grafik-
fähigen Browser ;-)

Viele Grüße,
Stefan

[EGOist]

wenn's nicht unbedingt exakt 10px sein müssen:
nimm statt margin ein oder mehrere (je nach textgröße) whitespaces - das versteht auch der ns4...

Was verstehst du unter Whitespaces? Leerzeichen? Transparente Gifs?

Also das ist nicht das Wahre. Denn ich hab in meinem Text ja ein paar Zeilenumbrüche drin (automatische, die durch die Tabellenbreite hervorgehen). Danke trotzdem.

[MudGuard]

Hi,

Bin hier grad fleissig am Scripten. Jetzt hab ich ein Problem: Ich möchte den Abstand vom Bild zum Text festlegen. Mit ab IE5 und Opera kein Problem, nur Netscape4 will den Abstand nicht darstellen. Würde mich ja damit abfinden, nur mit Netscape4 soll die Seite laut Kunde auch noch anschaubar sein.

Wie wäre es, das Attribut zu benutzen, das Du eh schon angibst (hspace - und dazu noch vspace)?
(ungetestet, hab keinen Netscape 4.x da...)

Oder statt margin mal padding probieren ...
(ungetestet, hab keinen Netscape 4.x da...)

Eine andere Methode wäre, das Bild an den gewünschten Seiten um die gewünschte Größe mit transparenten Flächen zu vergrößern...

cu,
Andreas