Zum Inhalt springen

TMENU mit Zeilenumbruch wenn Wort zu lang

Erstellt am 18. Juli 2006 · 7 Antworten · letzte Antwort am 21. Juli 2006

Tags: HTML & CSS, Frage

highlander ·

Hallöchen,

Wie stelle ich es an wenn in einem TMENU ein Menüeintrag zu lang wird und er geteilt werden muss. Im GMENU gibt es eine Lösung, aber wie gehts im TMENU?

Unbekannter Benutzer ·

Na eigentlich müssten bei nem TMENU ja automatisch Zeilenumbrüche kommen, da das ja einfacher Text ist. Wenn dein Problem ist, dass du einzelne Worte hast, die zu lang sind, dann müsstest du wohl deine Seitentitel einfach getrennt schreiben, also anstatt:

UnheimlichlangerSeitentitelohneLeerzeichen

so

UnheimlichlangerSeiten- titelohneLeerzeichen

Hoffe du verstehtst was ich meine...

highlander ·

Danke Kitsunet

Das wäre zu einfach. Es wird nun getrennt aber der zweite Teil des Wortes kommt auf derselben Zeile grrr.

Es muss wohl an der CSS-Formatierung liegen.

Hier mein Menuaufbau:

          1 = TMENU
          1 {
             NO = 1
             NO {
             allWrap = <h1 class="navi_1"> | </h1>
             ATagParams=class="navi_1"
             }
             ACT = 1
             ACT {
             allWrap = <h1 class="navi_1_active"> | </h1>
             ATagParams=class="navi_1_active"
             }
           }
          
       
          2 = TMENU
          2 {
             NO = 1
             NO {
             allWrap = <p class="navi_2"> | </p>
             ATagParams=class="navi_2"
             }
             ACT = 1
             ACT {
             allWrap = <p class="navi_2_active"> | </p>
             ATagParams=class="navi_2_active"
             }
           }      
         }

eigentlich doch ein einfacher und richtiger Aufbau oder ist hier etwas grundsätzlich falsch?

und hier die entsprechende CSS-Formatierung

h1 {font-family : arial,verdana; font-size: 10pt; line-height: 12pt; font: regular}

.navi_1 {color: #34506d; text-decoration: none; padding-top: 0pt; padding-left: 0pt}
.navi_1:hover {color: #ffffff; }
.navi_1_active {color: #ffffff; text-decoration: none; padding-top: 0pt; padding-left: 0pt}

.navi_2 { font-size: 10pt; line-height: 1pt; color: #34506d; text-decoration: none; padding-top: 0pt; padding-left: 3pt}
.navi_2:hover { color: #ffffff}
.navi_2_active { font-size: 10pt; line-height: 1pt; color: #ffffff; text-decoration: none; padding-top: 0pt; padding-left: 3pt;}

Da ich kein CSS-Freak bin kann hier bestimmt eine viel bessere Foramtierung gemacht werden, dies ist halt mit "Try and Error" entstanden.

highlander ·

Du hast recht, das war auch noch falsch...

hier die Version die Funktioniert...

.navi_1 {font-size: 10pt; color: #34506d; text-decoration: none}
.navi_1:hover {color: #ffffff; }
.navi_1_active {font-size: 10pt; color: #ffffff; text-decoration: none}

.navi_2 { font-size: 10pt; color: #34506d; text-decoration: none; padding-top: 0pt; padding-left: 3pt}
.navi_2:hover { color: #ffffff}
.navi_2_active { font-size: 10pt; color: #ffffff; text-decoration: none; padding-top: 0pt; padding-left: 3pt}

blöd ist jetzt nur dass, wenn ein Wort im "navi_2" (zweite Ebene) zu lang wird und getrennt werden muss, die zweite Zeile nicht mit "padding-left: 3pt" beginnt sondern bei 0. und das sieht Schei... aus.

Unbekannter Benutzer ·

versuch mal anstatt den p Tags dasselbe mit div zu machen. Außerdem würd ich die ATagParams Class extra machen, so hast du ja einmal bei deinem Absatz ein padding und dann nochmal bei deinem Link, das macht es nicht einfacher.

Kannst du eigentlich auch einfach so machen:

.navi_2 {padding-top: 0pt; padding-left: 3pt}
.navi_2 a{font-size: 10pt; color: #34506d; text-decoration: none;}

Dann brauchst du gar keinen ATagParams mehr. Musst du entsprechend natürlich auch für .navi_2_active machen...
Wahrscheinlich musst du danach deine Padding Werte anpassen, aber es sollte gehen.

highlander ·

Vielen Dank Kitsunet

Ich werde das (sobald ich aus den Ferien zurück bin) gerne testen. Nun geht es erst mal ab zum faulenzen. Andere Länder andere Syntax...

Inzwischen bin ich wieder mit dem Menübau auf das grafische GMENU umgestiegen. Damit lässt sich einfach mehr machen, vielleicht nicht mit ganz so wenig Code, aber dafür für alle Browser lesbar.

Unbekannter Benutzer ·

Na dann guten Urlaub. GMENU ist zwar für alle Browser lesbar, aber halt nicht für alle User...

Außerdem soll es ja Linux-User geben die mit Lynx auf der Konsole browsen. Die haben auch nur Text.