Darstellung Navipunkte nebeneinander, TMENU [Gelöst]

  • Dinchen21 Dinchen21
    Padawan
    0 x
    46 Beiträge
    0 Hilfreiche Beiträge
    15. 09. 2007, 18:47

    Hallo zusammen,

    ich würde gerne wissen, wie ich meine Navigationspunkte horizontal nebeneinander anordnen kann. Die Ausrichtung des horizontalen Menüs ist rechtsbündig.

    Bisher wird nur ein Navigationspunkt angezeigt und die folgenden sind nicht zu sehen. Ich könnte mir vorstellen das es an dem automatischen Zeilenumbruch oder an meiner CSS liegt, aber habe bisher leider noch keine Lösung gefunden :-(

    Hoffe das mir jemand weiterhelfen kann.

    Hier mein TS:
    [TS]...
    10 = TEMPLATE
    10.template = FILE
    10.template.file = fileadmin/designvorlage.html

    10.marks {
    MENU_HORIZONTAL = HMENU
    MENU_HORIZONTAL.special = directory
    MENU_HORIZONTAL.special.value = 7
    MENU_HORIZONTAL.entryLevel = 0
    MENU_HORIZONTAL.1 = TMENU
    MENU_HORIZONTAL.1 {
    noBlur = 1
    NO.linkWrap = <div class="linkblock_horizontal">|</div>
    CUR = 1
    CUR.linkWrap = <div class="linkblock_horizontal" style="background-color:#e9f0fb; color:#295c9f">|</div>
    CUR.ATagParams = style="color:#295c9f;"
    }
    ...
    [/TS]

    CSS:
    div.menuleiste_horizontal
    {
    width:900px;
    height:2em;
    background-color:#295c9f;
    margin-left:0px;
    margin-right:0px;
    border-top:2px solid #ffffff;
    margin-bottom:0px;
    padding:0em;
    overflow:hidden;
    float:left;
    }

    .linkblock_horizontal
    {
    border-left:2px solid #ffffff;
    font-size:1.0em;
    width:10em;
    height:2em;
    color:#ffffff;
    text-align:center;
    float:right;
    }

    .linkblock_horizontal a,
    .linkblock_horizontal a:visited
    {
    text-decoration:none;
    font-family:verdana,sans-serif,sans;
    display:block;
    color:#ffffff;
    margin:0em;
    padding-right:0em;
    padding-left:0em;
    padding-bottom:0em;
    padding-top:3px;
    }

    .linkblock_horizontal a:hover
    {
    height:2em;
    margin:0em;
    padding-right:0em;
    padding-left:0em;
    padding-bottom:0em;
    padding-top:3px;
    display:block;
    color:#295c9f;
    background-color:#e9f0fb;
    }

    .linkblock_horizontal a:active
    {
    height:2em;
    margin:0em;
    padding-right:0em;
    padding-left:0em;
    padding-bottom:0em;
    padding-top:3px;
    display:block;
    color:#295c9f;
    background-color:#e9f0fb;
    }

    Vielen Dank!
    Gruß Dinchen


  • 1
  • 0 x
    19 Beiträge
    0 Hilfreiche Beiträge
    16. 09. 2007, 18:58

    Poste doch noch die HTML-Ausgabe von TypoScript, damit ich sehen kann, wie die einzelnen Menupunkte gewrapt werden!

    Aber eins schon mal vorweg:

    Wenn Du die li-Elemente in Deinem CSS mit float:left oder display:inline ansprichst müssten sich diese horizontal darstellen.

  • Dinchen21 Dinchen21
    Padawan
    0 x
    46 Beiträge
    0 Hilfreiche Beiträge
    17. 09. 2007, 10:29

    Erstmal Danke für deinen Rat!

    Beim ersten Versuch habe ich display:block durch display:inline ersetzt,
    dies hat aber leider nichts geholfen.
    Beim Ändern von float wurde nur die Position des Navipunktes verschoben aber die weiteren Navipunkte wurden nicht nebeneinander angezeigt. *grübel*

    Hier noch ein Auszug aus der HTML-Ausgabe:
    ..
    <div class="umrandung">
    <div class="header"></div>
    <div class="menuleiste_horizontal">
    <div class="linkblock_horizontal">
    <div class="linkblock_horizontal"><a href="index.php?id=8" >Kontakt</a></div><div class="linkblock_horizontal"><a href="index.php?id=9" >Suche</a></div><div class="linkblock_horizontal"><a href="index.php?id=10" >Impressum</a></div>
    </div>
    </div>
    ...

    Gruß Dinchen

  • Dinchen21 Dinchen21
    Padawan
    0 x
    46 Beiträge
    0 Hilfreiche Beiträge
    17. 09. 2007, 11:25

    Habe die Lösung gefunden :-)
    Wenn man den div-Container um den Marker entfernt, wirds richtig angezeigt.

    Gruß Dinchen

  • 1