(HTML/CSS/MENSCHELEI) Zeilenumbruch verhindern

[Utz]

Hi zusammen,

ich versuche, einigen Textlinks vernünftige "Verhaltensregeln" beizubringen, will sagen: innerhalb des Textes _eines_ Links darf nicht umgebrochen werden, es darf nur _zwischen_ den Links umgebrochen werden.

Bisher hatte ich folgendes:

<nobr>[ <a href="neapel/index.htm" class="navi">Neapolitanische Mandoline</a> <wbr>
<a href="bluegrass/index.htm" class="navi">Bluegrass-Mandoline</a> <wbr>
<a href="barock/index.htm" class="navi">Barock-Mandoline</a> <wbr>
<a href="familie/mandola.htm" class="navi">Mandola</a> <wbr>
<a href="familie/index.htm" class="navi">Piccolo-Mandoline, Alt-Mandoline, Mandoloncello, Tremolobass</a> <wbr>
<a href="weniger.htm">weitere Mandolinen</a> ]</nobr>

Leider interpretiert mein NS 4.6 die <wbr> nicht, so dass kein Zeilenumbruch erfolgt, es erscheint der bäh-Scrollbalken, alles wird in die Breite gezogen...

Also muss eine Alternative gefunden werden - daher Verzicht auf die <nobr>-Variante (ist ja eh kein gültiges HTML) und alles "herkömmlich" mit Non-Breaking-Spaces, also so:

[ <a href="neapel/index.htm" class="navi">Neapolitanische Mandoline</a> 
<a href="bluegrass/index.htm" class="navi">Bluegrass-Mandoline</a> 
<a href="barock/index.htm" class="navi">Barock-Mandoline</a> 
<a href="familie/mandola.htm" class="navi">Mandola</a> 
<a href="familie/index.htm" class="navi">Piccolo-Mandoline, Alt-Mandoline, Mandoloncello, Tremolobass</a> 
<a href="weniger.htm">weitere Mandolinen</a> ]

Prima Ergebnis im Netscape, aber oh weh! IE bricht an den Bindestrichen um. Großes *hmpf*!

Nächster Versuch: ich füge meiner Klasse "navi" Anweisungen für white-space zu - weder pre noch nowrap zeigen Wirkung im IE.

Ultima Ratio: ein Versuch, statt einfach - die Kodierung &45; zu setzen. Wie zu erwarten ein Misserfolg.

Einen hatte ich doch noch: die zweite Variante, ergänzt um <nobr>...</nobr> um die Wörter mit Bindestrich. Hei, wie lustig plötzlich der IE auch dort umbricht, wo es ihm mit   eigentlich untersagt ist!

Tja, jetzt bin ich mit meinem Latein fast am Ende. Aber noch gebe ich nicht auf, eine Idee habe ich noch:

<nobr>[ <a href="neapel/index.htm" class="navi">Neapolitanische Mandoline</a> </nobr>
<nobr><a href="bluegrass/index.htm" class="navi">Bluegrass-Mandoline</a> </nobr>
<nobr><a href="barock/index.htm" class="navi">Barock-Mandoline</a> </nobr>
<nobr><a href="familie/mandola.htm" class="navi">Mandola</a> </nobr>
<nobr><a href="familie/index.htm" class="navi">Piccolo-Mandoline, Alt-Mandoline, Mandoloncello, Tremolobass</a> </nobr>
<nobr><a href="weniger.htm">weitere Mandolinen</a> ]</nobr>

Tja, und was soll ich sagen? Wieder weigert sich NS 4.6, zwischen schließendem </nobr> und dem nächsten <nobr> umzubrechen - Ergebnis: eine riesige ewiglange Zeile.

So, und was jetzt? Hat jemand ne Idee, was ich noch versuchen könnte, um mit beiden Browsern einigermaßen zuverlässig die Umbrüche an die richtige Stelle zu kriegen?

Grüße,

Utz (der jetzt eigentlich viel lieber ein paar km weiter am Müggelsee wäre)

[Cheatah]

Hi,

Leider interpretiert mein NS 4.6 die <wbr> nicht,

doch, allerdings offenbar nicht innerhalb von <nobr>. Man kann es ihm nicht anlasten, denn beide Tags sind nicht Teil von HTML, weswegen ihr Verhalten nicht standardisiert ist.

Einfache Lösung:

<nobr>[ <a href="neapel/index.htm" class="navi">Neapolitanische Mandoline</a> </nobr>
<nobr><a href="bluegrass/index.htm" class="navi">Bluegrass-Mandoline</a> </nobr>

[...]

Ist mindestens bei mir erprobt, und bisher hatte ich noch keine Probleme damit.

Tja, und was soll ich sagen? Wieder weigert sich NS 4.6, zwischen schließendem </nobr> und dem nächsten <nobr> umzubrechen - Ergebnis: eine riesige ewiglange Zeile.

Kann ich nicht bestätigen. Vielleicht hängt es mit Deiner class="navi" zusammen? Netscape hat ja bekanntermaßen <Diplomatie>ein paar Schwierigkeiten</Diplomatie> mit CSS.

Cheatah

[Utz]

Hi Cheatah,

Kann ich nicht bestätigen. Vielleicht hängt es mit Deiner class="navi" zusammen? Netscape hat ja bekanntermaßen <Diplomatie>ein paar Schwierigkeiten</Diplomatie> mit CSS.

Auch ohne, leider. Hab gerade nicht nur die class="navi" Definitionen aus den <a>-Tags genommen, sondern sicherheitshalber gleich die Referenz zum Stylesheet auskommentiert plus alle Tags, die noch class-Attribute hatten - damit gibt's kein einziges CSS-Element mehr. Und dann noch überhaupt alles andere auskommentiert. Ergebnis: es gibt immer noch keine Zeilenumbrüche. Das war der komplette Code des Tests:

<HTML>
<HEAD>
<TITLE>www.mandoline.de - Über Mandolinen</TITLE>
<META HTTP-EQUIV="content-type" CONTENT="text/html; charset=iso-8859-1">
<META NAME="author" CONTENT="Utz Grimminger">
<META NAME="keywords" CONTENT="Mandoline, mandoline, mandolin, Mandolin, mandolina, Mandolina,
Zupfmusik, zupfmusik, Zupforchester, zupforchester">
<META NAME="description" CONTENT="www.mandoline.de - Informationen rund um die Mandoline">
<HEAD>
<BODY>
<nobr>[ <a href="neapel/index.htm">Neapolitanische Mandoline</a> </nobr>
<nobr><a href="bluegrass/index.htm">Bluegrass-Mandoline</a> </nobr>
<nobr><a href="barock/index.htm">Barock-Mandoline</a> </nobr>
<nobr><a href="familie/mandola.htm">Mandola</a> </nobr>
<nobr><a href="familie/index.htm">Piccolo-Mandoline, Alt-Mandoline, Mandoloncello, Tremolobass</a> </nobr>
<nobr><a href="weniger.htm">weitere Mandolinen</a> ]</nobr>
</BODY>
</HTML>

Damit bin ich noch ratloser als vorher, denn Deinen Tipp mit dem CSS fand ich eigentlich einleuchtend.

Grüße,

Utz

[Slyh]

Hi,

die Lösung für dein Problem: (ja, heute bin ich selbstsicher :-))

<nobr>[ <a href="neapel/index.htm">Neapolitanische Mandoline</a> </nobr>
<nobr><a href="bluegrass/index.htm">Bluegrass-Mandoline</a> </nobr>
<nobr><a href="barock/index.htm">Barock-Mandoline</a> </nobr>
<nobr><a href="familie/mandola.htm">Mandola</a> </nobr>
<nobr><a href="familie/index.htm">Piccolo-Mandoline, Alt-Mandoline, Mandoloncello, Tremolobass</a> </nobr>
<nobr><a href="weniger.htm">weitere Mandolinen</a> ]</nobr>
</BODY>
</HTML>

Sprich:
Das </nobr> direkt hinter das pappen. Dafür das Leerzeichen, das jetzt ja fehlt, an den Anfang der
nächsten Zeile kleben. Oder wahlweise auch nach dem </nobr>. (nicht getestet)

Probier mal, ob das nun das von dir gewünschte Ergebnis erziehlt. Ich habe nur mal grob im NS und IE getestet.

Gruß,
Slyh

[Utz]

Hi Slyh,

die Lösung für dein Problem: (ja, heute bin ich selbstsicher :-))

Und mit was? Mit Recht!!!

Das </nobr> direkt hinter das pappen.

Das war's! Aber erklären kannst Du mir das auch nicht, oder? Was soll denn vernünftigerweise gegen dieses Leerzeichen einzuwenden sein?

Dafür das Leerzeichen, das jetzt ja fehlt, an den Anfang der
nächsten Zeile kleben. Oder wahlweise auch nach dem </nobr>. (nicht getestet)

War nicht mal nötig, steht ja jeweils in verschiedenen Zeilen, und der Zeilenumbruch des Quelltextes wird ja schon als Leerzeichen dargestellt.

Also wenn's denn ginge würde ich Dir für diese Lösung glatt eine Krone verpassen!

Grüße,

Utz

PS: Falls mal wer im Archiv über diesen Thread stoplert und sich wundert, dass da Zeichen fehlen - das sind dann Pipes (AltGr + <), die verschluckt der Schwanzabschneider.

[Slyh]

Hi,

die Lösung für dein Problem: (ja, heute bin ich selbstsicher :-))

Und mit was? Mit Recht!!!

*g*

Das </nobr> direkt hinter das pappen.

Das war's! Aber erklären kannst Du mir das auch nicht, oder? Was soll denn vernünftigerweise gegen dieses Leerzeichen einzuwenden sein?

Naja, ich versuch's mal. Du weißt wahrscheinlich, daß die Browser keine 2 Leerzeichen hintereinander dar-
stellen (können/wollen). So wie ich das sehe, wird jedes weitere Leerzeichen nach dem ersten einfach entfernt.
Wie du weiter unten richtig feststellst, zählt ein Zeilenumbruch auch als Leerzeichen. Die Zeilen in deiner Datei
sehen also quasi so aus (wenn man eben die Zeilenumbrüche durch Leerzeichen ersetzt - wie das der Browser tut):
<nobr>[ <a href="neapel/index.htm">blabla</a> </nobr> <nobr><a href="bluegrass/index.htm">blabla2</a> </nobr>
Dein Leerzeichen nach der Pipe ist das erste, und das nach </nobr> ist das zweite. Und richtig, das wird
entfernt, so daß das </nobr> direkt am <nobr> hängt, also so: </nobr><nobr>.
Logischerweise kann der Browser dann dort also nicht mehr umbrechen, weil zwischen den zwei <nobr>-Bereichen
einfach nichts mehr zum Umbrechen ist. Ich hoffe, daß das einigermaßen verständlich war. (und vor allem richtig)

(aber nicht daß du denkst, daß ich durch diesen Denkvorgang an die Lösung gekommen bin. Das ist mir
erst viel später gekommen :-))

War nicht mal nötig, steht ja jeweils in verschiedenen Zeilen, und der Zeilenumbruch des Quelltextes wird ja schon als Leerzeichen dargestellt.

Hatte ich auch nicht gewußt. (habe das meistens nach Gefühl gemacht :-))

PS: Falls mal wer im Archiv über diesen Thread stoplert und sich wundert, dass da Zeichen fehlen - das sind dann Pipes (AltGr + <), die verschluckt der Schwanzabschneider.

Das mußt du mir jetzt allerdings erklären. Verschluckt das Archiv die Pipes?
(hoffend, daß dies nicht in der FAQ steht :-))

Gruß,
Slyh

[Utz]

Hi Slyh,

Naja, ich versuch's mal. Du weißt wahrscheinlich, daß die Browser keine 2 Leerzeichen hintereinander dar-
stellen (können/wollen). So wie ich das sehe, wird jedes weitere Leerzeichen nach dem ersten einfach entfernt.

Das ist so. Hab gerade eine kleine Testreihe gemacht - mit Leerzeichen vor _und_ nach dem </nobr> verhält sich der Browser so, als sei das Leerzeichen nach dem </nobr> nicht da. Das war mir neu - war immer davon ausgegangen, dass die "Leerzeichenunterschlagung" durch einen Tag unterbrochen wird (hab aber bisher noch nie wirklich drüber nachgedacht).

Was mir auch neu war ist, dass zwischen zwei Tags _ohne_ Leerzeichen resp. Zeilenumbruch dazwischen nicht umgebrochen wird. Kannte nur den Fall andersrum, dass durch einen Zeilenumbruch im Quelltext ein Leerzeichen entsteht.

So richtig auf die Schnauze gefallen bin ich wegen der Fehlerkorrektur des IE - der bricht nämlich auch um, wenn zwischen <nobr> und </nobr> kein Leerzeichen ist. Bei anderen Tags ohne Leerzeichen dazwischen - z.B. die Kombi </b><i> - bricht er nicht um. Da muss man erst mal drauf kommen...

Wer meine Testreihe ausprobieren möchte - hier ist sie:

<html>
<head>
<title>test</title>
<meta name="author" content="Administrator">
<meta name="generator" content="Ulli Meybohms HTML EDITOR">
</head>
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<nobr>Testtext </nobr> <nobr>das ist mit nbsp, und jetzt müsste dann ziemlich viel ziemlich langer Text kommen aber mir fällt nix ein, und jetzt müsste dann ziemlich viel ziemlich langer Text kommen aber mir fällt nix ein</nobr><br>
<nobr>Testtext </nobr> <nobr>das ist einfach so, und jetzt müsste dann ziemlich viel ziemlich langer Text kommen aber mir fällt nix ein, und jetzt müsste dann ziemlich viel ziemlich langer Text kommen aber mir fällt nix ein</nobr>
<nobr>Testtext </nobr><nobr>das ist ohne Leerzeichen zwischen </nobr> und <nobr>, und jetzt müsste dann ziemlich viel ziemlich langer Text kommen aber mir fällt nix ein, und jetzt müsste dann ziemlich viel ziemlich langer Text kommen aber mir fällt nix ein</nobr>
<nobr>Testtext</nobr> <nobr>das ist mit Leerzeichen zwischen </nobr> und <nobr>, aber ohne Leerzeichen vor </nobr>, und jetzt müsste dann ziemlich viel ziemlich langer Text kommen aber mir fällt nix ein, und jetzt müsste dann ziemlich viel ziemlich langer Text kommen aber mir fällt nix ein</nobr>
<b>langesgebrabbelhjkhkjhwkuwkfhsdmjhf,ghr,jkh,jkh,fvjkhk,tjh,tkjh,kjhqfjkvhd,fhk,jdfhvk,adfjvhdfjkvhadfjvhakvjhadvjkhad,jkvhadvjkhad</b><i>langesgebrabbelhjkhkjhwkuwkfhsdmjhf,ghr,jkh,jkh,fvjkhk,tjh,tkjh,kjhqfjkvhd,fhk,jdfhvk,adfjvhdfjkvhadfjvhakvjhadvjkhad,jkvhadvjkhad</i>
</body>
</html>

PS: Falls mal wer im Archiv über diesen Thread stoplert und sich wundert, dass da Zeichen fehlen - das sind dann Pipes (AltGr + <), die verschluckt der Schwanzabschneider.

Das mußt du mir jetzt allerdings erklären. Verschluckt das Archiv die Pipes?

AFAIK schluckt natürlich nicht das Archiv die Pipes, sondern der Schwanzabschneider, der die Dateien aus der Hauptdatei in das Archiv überträgt. Warum das so ist, kann ich Dir nicht sagen. Ich weiß nicht mal, ob das nicht vielleicht mittlerweile geändert wurde.

(hoffend, daß dies nicht in der FAQ steht :-))

Keine Sorge - ich hab's zumindest dort nirgends gesehen :-)

Grüße,

Utz

[Stefan Einspender]

Hallo Utz!

Da schaue ich eben mal hier wieder rein und gleich etwas gelernt!
Danke für diesen Tipp, ist eine sehr einfache Lösung, welche man
erstmal finden muß.

Also wenn's denn ginge würde ich Dir für diese Lösung glatt eine Krone verpassen!

<img src="http://www.teamone.de/selfaktuell/src/xiq.gif" alt="">

Viele Grüße aus Dresden,
Stefan Einspender

[Carsten]

Hallo Utz,

Ultima Ratio: ein Versuch, statt einfach - die Kodierung &45; zu setzen.
Wie zu erwarten ein Misserfolg.

Schonmal mit &#150; probiert?
Ok es ist ein wenig länger – aber vielleicht hält er das nicht für
ein Trennzeichen.

Gruss,
Carsten

[Utz]

Hi Carsten,

Schonmal mit &#150; probiert?
Ok es ist ein wenig länger - aber vielleicht hält er das nicht für
ein Trennzeichen.

Gute Idee, danke, klappt aber leider auch nicht. Der IE trennt gnadenlos auch nach &#150;. Und damit nicht irgendwer doch noch was dagegen tun kann - er trennt auch nach &#151;

Grüße,

Utz