V14 - Menüfelder nur so lang wie der Text ist.

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • V14 - Menüfelder nur so lang wie der Text ist.

    Seitdem die V14 mit dem Menüobjekt da ist benötigt man nicht mehr ellenlangen Code für jeden Menüpunkt einzeln wenn man die Menübuttons nur so lange haben will wie der Text lang ist.

    Dazu gibt es diesen Code:

    CSS-Quellcode

    1. <style>
    2. #imHeader_imMenuObject_01 > ul > li > .label-wrapper, #imHeader_imMenuObject_01 > ul > li > div > .label-wrapper {
    3. width: auto!important;
    4. padding: 0 10px 0 10px;
    5. }
    6. </style>
    Wobei man die Nummer hinter den Selektoren (01) mit dem eigenen Menüselektor umbessern muss.(2 x) Diesen findet man nur im Quelltext! Leider funktioniert Firebug nicht mehr im FF aber ich habe mir den Firefox Developer Browser installiert der einen guten Ersatz darstellt um gleich zum Selektor zu springen die man benötigt.

    Der Code kommt natürlich unter "1" SEo&Code Reiter "Erweitert" vor dem </head> Tag rein.
    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !
  • Sorry die Korrektur dürfte es nicht gespeichert haben. Oder ich habe es nicht freigegeben.

    Hier nochmals der komplette Code:

    CSS-Quellcode

    1. <style>
    2. #imHeader_imMenuObject_04 > ul > li > .label-wrapper, #imHeader_imMenuObject_04 > ul > li > div > .label-wrapper, #imStickyBar_imMenuObject_01 > ul > li > .label-wrapper, #imStickyBar_imMenuObject_01 > ul > li > div > .label-wrapper {
    3. width: auto!important;
    4. padding: 0 10px 0 10px;
    5. }
    6. </style>
    Ansonsten so verfahren wie oben beschrieben.
    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !
  • Guten Morgen,

    sitze seit gestern 12 Uhr an einer neuen Seite und fragte mich das dann auch.
    Der Zufallsfund hier ist gut, aber für mich nicht als Beginner mit CSS nicht ganz schlüssig.
    Weiss jetzt nicht genau was ich vom Quelltext übernehmen muss.
    Vielleicht hast Du eine kurze Erklärung für mich?
    Seite soll morgen veröffentlicht werden, aber diesen Punkt kann ich ja immer noch nachbessern.
    Schonmal danke
    Heide

    ... bin begeistert, wie man uns hier hilft, so dass sogar ein Anfänger mit html und css Fortschritte macht mit learning by doing...

    andy67 schrieb:

    Seitdem die V14 mit dem Menüobjekt da ist benötigt man nicht mehr ellenlangen Code für jeden Menüpunkt einzeln wenn man die Menübuttons nur so lange haben will wie der Text lang ist.

    Dazu gibt es diesen Code:

    CSS-Quellcode

    1. <style>
    2. #imHeader_imMenuObject_01 > ul > li > .label-wrapper, #imHeader_imMenuObject_01 > ul > li > div > .label-wrapper {
    3. width: auto!important;
    4. padding: 0 10px 0 10px;
    5. }
    6. </style>
    Wobei man die Nummer hinter den Selektoren (01) mit dem eigenen Menüselektor umbessern muss.(2 x) Diesen findet man nur im Quelltext! Leider funktioniert Firebug nicht mehr im FF aber ich habe mir den Firefox Developer Browser installiert der einen guten Ersatz darstellt um gleich zum Selektor zu springen die man benötigt.

    Der Code kommt natürlich unter "1" SEo&Code Reiter "Erweitert" vor dem </head> Tag rein.
  • In jedem Browser gibt es einen Inspektor oder eine Quelltextanzeige. Im Chromebrowser gibt es unter "weitere Tools" das "Entwicklertool" und dann geht rechts ein Fenster auf. Du ladest dir deine Seite rein und gehst dann in dem Entwicklertool links oben auf den Pfeil. Damit kannst du genau die stelle markieren vom Menü das du brauchst.

    menubild.jpg

    Normalerweise ist es immer die 01 wenn du noch kein Menü eingefügt hattest. Es kommt auch darauf an wo du das Menü eingefügt hast.
    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !
  • AKTUELLES UPDATE FÜR DIE V17


    Quellcode

    1. <style>
    2. #imHeader_imMenuObject_01_container > ul > li > .label-wrapper, #imHeader_imMenuObject_01_container > ul > li > div > .label-wrapper {
    3. width: auto!important;
    4. padding: 0 10px 0 10px;
    5. }
    6. </style>

    Wie ganz oben beschrieben muss man die Zahl "01" ändern auf die Zahl beim eigenen Menü Objekt ! Sieht man nur im Quelltext der eigenen Seite !

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