Danny Müller: DIV: automatischer Zeilenumbruch bei zu langem Wort?

Guten Morgen,

ich habe auf meiner Seite ein DIV welches die Größe je nach Auflösung automatisch anpasst. In dieses Werden aus einer Datenbank die Inhalte ausgelesen (Gästebuch).
Nun ist es mir passiert, dass jemand ein langes Wort / Link eingegeben hat.
 Bsp.: <a href="http://...">hier_ist_das_lange_wort_welches_die_laenge_des_divs_ueberschreitet</a>

Aus diesem Grund habe ich in dem Div die Option "overflow: hidden" angegeben. Dies funktioniert allerdings nicht im Internet Explodierer. Dort wird das Div automatisch vergrößert und somit mein Layout gesprengt.

Weiß jemand von euch eine Möglichkeit das lange Wort bzw. den Link automatisch am Ende des Divs umzubrechen?

Thanks
Danny

  1. Hallo,

    da es sich um ein Gästebuch handelt, nehm ich mal an du kannst die Texte serverseitig anpassen. Viele Foren / Gästebücher bedienen sich da eines Tricks: sie ersetzen bei langen Hyperlinks den Pfad und Querystring mit einer kürzeren Version, also z.B.:

    <a href="http://www.example.com/hier_ist_das_lange_wort_welches_die_laenge_des_divs_ueberschreitet">www.example.com/hie...tet</a>

    Das kannst du mit Regulären Ausdrücken relativ einfach realisieren.

    Viele Grüße,
    Michael

    --

    <img src="http://www.nailware.de/images/nailware_logo.jpg" border="0" alt="">
    --
    <img src="http://www.nailware.de/images/no_epatents.gif" border="0" alt="">
    Online Petitionen gegen Software Patente:
    http://petition.eurolinux.org/index_html?LANG=de
    1. Hallo Michael,

      da es sich um ein Gästebuch handelt, nehm ich mal an du kannst die Texte serverseitig anpassen. Viele Foren / Gästebücher bedienen sich da eines Tricks: sie ersetzen bei langen Hyperlinks den Pfad und Querystring mit einer kürzeren Version, also z.B.:

      <a href="http://www.example.com/hier_ist_das_lange_wort_welches_die_laenge_des_divs_ueberschreitet">www.example.com/hie...tet</a>

      Okay, das wäre bei Hyperlinks möglich, aber was wäre wenn mich jemand ärgern möchte und einfach so ein langes Wort ins GB schreibt?
      Beispiel: "ein_langes_wort_welches_aber_kein_link_ist_aber_dennoch_das_div_sprengt"

      Gibt es hierfür vielleicht auch noch eine Lösung?

      Thanks
      Danny

      1. Hi,

        Okay, das wäre bei Hyperlinks möglich, aber was wäre wenn mich jemand ärgern möchte und einfach so ein langes Wort ins GB schreibt?
        Beispiel: "ein_langes_wort_welches_aber_kein_link_ist_aber_dennoch_das_div_sprengt"

        Inwievern unterscheidet sich ein Wort in einem Link von einem Wort außerhalb eines Links, daß Du meinst, die scriptgesteuerte Verkürzung (oder Aufteilung) des Wortes sei dort nicht möglich?

        cu,
        Andreas

        --
        MudGuard? Siehe http://www.Mud-Guard.de/
        Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
        1. Hallo Andreas,

          Inwievern unterscheidet sich ein Wort in einem Link von einem Wort außerhalb eines Links, daß Du meinst, die scriptgesteuerte Verkürzung (oder Aufteilung) des Wortes sei dort nicht möglich?

          Ich dachte, dass ich bei einem Link so vorgehe:
          Beispielsweise aus einem langen Link...
          <a href="http://ein_langes_wort_welches_aber_kein_link_ist_aber_dennoch_das_div_sprengt">http://ein_langes_wort_welches_aber_kein_link_ist_aber_dennoch_das_div_sprengt</a>

          ...einen kurzen Link machen:

          <a href="http://ein_langes_wort_welches_aber_kein_link_ist_aber_dennoch_das_div_sprengt">Klick Hier</a>

          Ich dachte, Michael Nagler meinte es so?

          Ich verstehe nicht, wie ich scriptgesteuert einen Zeilenumbruch einfügen soll (egal ob bei Link oder Wörtern), wenn ich nicht weiß, wie lang das Div ist, weil dieses je nach Auflösung / Seitengröße automatisch angepasst wird?

          Thanks
          Danny Müller

          1. Hallo,

            Generell würde ich zunächst die Hyperlinks wie in meiner ersten Antwort  beschrieben verkürzen.

            Dann kannst du mit einem weiteren reg. Ausdruck auch lange Wörter mit Whitespaces ausstatten. Dabei musst du dann aber darauf achten, dass du nich die href's aus den Tags auch zerstückelst.

            An die langen Wörter hatte ich in der ersten Antwort nicht gedacht.

            Eine weitaus einfachere Möglichkeit ist, ein Gästebuch mit einem kleinen Adminbereich zu verwenden, wo du die Einträge manuell bearbeiten kannst. Normalerweise kommt sowas ja nicht so oft vor.

            Ein solches Gästebuch findest du z.B. hier: http://cms.domainfactory.de/Downloads.438.0.html

            Viele Grüße,
            Michael

            --

            <img src="http://www.nailware.de/images/nailware_logo.jpg" border="0" alt="">
            --
            <img src="http://www.nailware.de/images/no_epatents.gif" border="0" alt="">
            Online Petitionen gegen Software Patente:
            http://petition.eurolinux.org/index_html?LANG=de
  2. Hi,

    Weiß jemand von euch eine Möglichkeit das lange Wort bzw. den Link automatisch am Ende des Divs umzubrechen?

    ab IE 6.0: text-overflow: clip (abschneiden)/ellipsis (durch "..." ersetzen)

    ab IE 5.5: word-wrap: normal/break-word; (bricht im Wort um)

    Ansonsten: In der Programmiersprache des GBs (PHP?) auf Wortlänge checken und ggf. Zeilenumbruch einsetzen?

    Gruß, Cybaer

    --
    Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
    1. Hy Cybaer,

      ab IE 5.5: word-wrap: normal/break-word; (bricht im Wort um)

      genau sowas habe ich gesucht*g* Das gefällt mir ja echt am besten.
      Gibt es diese Möglichkeiten auch noch in anderen Browsern (z.B. Mozilla Firefox?), weil das ja wiederum nur im IE funtzt.

      Wenn das nur im IE geht, müsste ich die word-wrap mit overflow kombinieren...

      Thanks
      Danny Müller

      1. Hi,

        Gibt es diese Möglichkeiten auch noch in anderen Browsern (z.B. Mozilla Firefox?), weil das ja wiederum nur im IE funtzt.

        Nein, ist proprietär.

        Wenn das nur im IE geht, müsste ich die word-wrap mit overflow kombinieren...

        Nimm ggf. eine CSS-Browserweiche (->Google).

        Gruß, Cybaer

        --
        Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!