Beschriftung der Reiter/Tabs zweizeilig

  • Hallo


    Gibt es eine Möglichkeit die Beschriftung der Reiter 2-Zeilig zu machen? Statt Eingereichte soll dort eingentlich Eingereichte Publikationen und Patent- soll Patentanmeldung und Offen- soll offenlegung sein.


    Gruß Rainer


    00-05.JPG

  • Gib mal die "-" weg! Nur ein Leerzeichen zwischen den Namen. Und Platz sollte auch sein oben und unten.

    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !

  • Hallo Andy


    Ich arbeite mit der Version V12prof. Wo kann ich bei der von Dir angegebenen Website ein Beispiel sehen?


    Gruß Rainer

  • Sorry ich habe es verwechselt mit den Menübutton. Es sind ja Tabreiter von einem Text-OBjekt oder? Das müsste ich erst testen ob das geht.

    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !

  • schlimmstenfalls machst ein Bild mit der Beschriftung und fügst das ein.

    Bernie


    " Was wir alleine nicht schaffen, das schaffen wir dann zusammen..."


    :thumbsup:

  • Hallo


    Ja es sind Tabreiter von einem Text-OBjekt. Hätte ich vielleicht dazu schreiben sollen.
    Bernie, diese Variante möchte ich nicht anwenden.


    Gruß Rainer

  • . . . meinst Du so etwas wie auf der Testseite ? Dann versuche mal mit den Einstellungen aus der Anlage zu spielen . . .

    Dateien

    • 2zeilig.jpg

      (82,08 kB, 13 Mal heruntergeladen, zuletzt: )

    Lieber mit vollem Mund reden - als mit leerem Hirn denken :saint:

  • @bernie: Habe ich früher auch so gemacht, ist aber verdammt SEO-untauglich und die Suchmaschinen sehen das nicht gerne (= eigentlich nichts ;o)


    @fussel: Ist wie pcssa schrieb, eine Kombination aus der richtigen Einstellung des Hauptmenü-Stils, evtl. auch Schriftartwahl und deren Größe.
    Dir gutes Gelingen! (und poste mal ´n Pic von der gelösten Lösung!)

  • Hallo


    Es geht ja NICHT um ein Menü sondern um die Tabreiter in einem Text-OBjekt.


    00-06.JPG



    Gruß Rainer

  • ICh habe ein bisschen getestet und bin draufgekommen, dass es von der Font größe abhängt. Nicht dass man es kleiner schaltet sondern es hängt bei der Css 2 verschiedene Werte an die das floaten verhindert. z.B. font: 18pt/130px "Tahoma";


    Leider kann man das nur per CSS korrigieren.
    Dazu muss man zuerst rausfinden welche Nummer das Text-Objekt hat im Quellcode und dann folgende Zeile vor dem </head> Tag einfügen.


    CSS
    1. <style>
    2. #imTextObject_1 .tab {
    3. font: 1.5em "Tahoma";
    4. vertical-align: middle;
    5. }
    6. </style>


    Die Nummer 1 ersetzen mit deiner Nummer ! Und gegebenenfalls die Größe des Fonts ändern.

    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !

  • Hallo Andy


    So hat es funktioniert.


    010-05.JPG


    Wenn man jetzt noch die Einzeiligen etwas runter bekommen würde wäre es ideal.
    Mit dem Einfügen von padding und margin Angaben wird aber immer der gesammte Tab verschoben. Ist irgendwie blöd gelöst von Inco.


    Gruß Rainer

  • Haben die Tabs evtl. eigene Klassen? Ich hab nur 3 im Projekt die heißen

    HTML
    1. class="tab first-tab selected-text-tab"
    2. class="tab"
    3. class="tab last-tab"

    da könnte man alle einzeln ansprechen. Wie es auf deiner Seite aussieht sieht man ja nur auf dem Bild :P

  • Hallo


    An den Code habe ich gar nicht gedacht.
    Also so sieht es aus:



    Zusätzlich noch folgender CSS-Code von Andy für die zweizeilige Darstellung. Schriftgröße angepasst.


    CSS
    1. <style>
    2. #imTextObject_5 .tab {
    3. font: 11px/15px "Tahoma";
    4. vertical-align: middle;
    5. }
    6. </style>


    Vielleicht kannst Du damit was anfangen.


    Gruß Rainer

  • Hallo


    Vielen Dank an alle helfenden. Nun passt es.


    010-06.JPG


    Den CSS-Code habe ich noch etwas angepasst.


    Der padding Wert ist wie weit der Text nach unten geschoben wurde. Der heigt Wert passt die Höhe des Reiters an. Der vergößert sich durch den padding Wert. Der height Wert ergibt sich aus der im CSS-Code ausgelesenen Höhe minus dem padding Wert.


    Ausgelesener CSS-Wert:
    #imTextObject_5 .tab {

    height: 49px;

    }


    Der Zusatz !important ist notwendig, da die Angaben sonst ignoriert werden.


    Gruß Rainer

  • Besten Dank. Dann kann ich das auch mal weiter nutzen :D


    Hast du auch schon mal geschaut wie sich das responsive verhält oder nutzt du die Funktion nicht?
    Ich weiß wie hässlich es responsive in normal aussieht aber wie es sich mit dem Code dann verhält nicht.

  • Hallo


    Beim responsiven sehe ich keinen Unterschied zwischen Originalcode und angepassten.


    11-05.JPG


    Original



    11-06.JPG


    mit gändertem Code




    Gruß Rainer