Forum für CMS/made simple

Turbinchen

Gast

[GELÖST] [GELÖST] Horizontales Menü

Hallo zusammen

Ich versuch mich nun seit einigen Wochen am Thema eigenes Template erstellen.

Nun steh ich aber irgendwie ein wenig auf dem Schlauch. Ich möchte ein Menü gerne von Links nach rechts. Zur Zeit wird es mir aber von oben nach unten angezeigt.

Ich hab folgenden Code im Template:

 Hier klicken, um den Code zum Kopieren zu markieren

<div style="position: absolute; width: 666px; height: 41px; z-index: 2; left: 201px; top: 19px" id="Menu">         
{menu loadprops=0 template='simple_navigation.tpl' number_of_levels='1'}</div>

Im Stylesheet hab ich nacher folgendes stehen:

 Hier klicken, um den Code zum Kopieren zu markieren

#Menu {
float: left; 
font-size: 15px; 
text-transform: uppercase; 
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
display: line;} 

Nun möchte ich aber wie gesagt die Menüpunkte nicht untereinander sondern nebeneinander.

Kann mir ev einer sagen, was ich da noch ergänzen muss. Irgendwie krieg ich das nicht hin :-(

nockenfell

Moderator

Ort: Gontenschwil, Schweiz

Registriert: 09. November 2010

Beiträge: 2.934

Webseite

Re: [GELÖST] [GELÖST] Horizontales Menü

Probiere es mal wie folgt:

 Hier klicken, um den Code zum Kopieren zu markieren

<div id="navigation">
{menu template='cssmenu.tpl'}
</div>

Stylesheet:

 Hier klicken, um den Code zum Kopieren zu markieren

#navigation  {
    font-family : Arial, Helvetia, sans-serif;
    text-transform : uppercase;
    color : #fff;
    background-color : #004f9b;
    font-size : 0.8em;
}
#navigation a:hover {
    text-decoration : underline;
}
#menuwrapper {
    width : 100%;
}
#primary-nav li li {
    width : 162px;
}
#primary-nav, #primary-nav ul {
    list-style : none;
    margin : 0;
    padding : 0;
}
#primary-nav ul {
    position : absolute;
    top : auto;
    display : none;
}
#primary-nav ul ul {
    margin-top : 1px;
    margin-left : -1px;
    left : 100%;
    top : 0;
}
#primary-nav li {
    margin-left : 0;
    float : left;
}
#primary-nav li li {
    margin-left : 0;
    float : none;
    position : relative;
}
#primary-nav a {
    display : block;
    margin : 0;
    padding : 9px 7px;
    text-decoration : none;
    color : #fff;
}
#primary-nav li li, 
#primary-nav li.menuparent li, 
#primary-nav li.menuparenth li {
    text-decoration : none;
    border : none;
}
#primary-nav li li a, 
#primary-nav li.menuparent li a, 
#primary-nav li.menuparenth li a {
    border-top : 1px solid #fff;
    border-bottom : 1px solid #fff;
    color : #000;
    font-size : 0.9em;
    background-color : #d8d8d8;
    text-decoration : none;
}
#primary-nav li li a:hover, 
#primary-nav li.menuparent li a:hover, 
#primary-nav li.menuparenth li a:hover {
    color : #000;
    text-decoration : underline;
}
#primary-nav li, 
#primary-nav li.menuparent {
    background-color : #004f9b;
}
#primary-nav li.menuparent li a, 
#primary-nav li.menuparenth li a {
    background-color : #d8d8d8;
    color : #000;
    text-decoration : none;
}
#primary-nav li.menuactive, 
#primary-nav li.menuactive a, 
#primary-nav li.menuactive li.menuactive, 
#primary-nav li.menuactive li.menuactive a {
    background-color : #003c91;
    color : #fff;
}
#primary-nav ul li.menuparent, 
#primary-nav ul li.menuparent:hover, 
#primary-nav ul li.menuparenth {
    background-position : center right;
    background-repeat : no-repeat;
}
#primary-nav li:hover, 
#primary-nav li.menuh, 
#primary-nav li.menuparenth, 
#primary-nav li.menuactiveh {
    background-color : #003c91;
}
#primary-nav ul, 
#primary-nav li:hover ul, 
#primary-nav li:hover ul ul, 
#primary-nav li.menuparenth ul, 
#primary-nav li.menuparenth ul ul {
    display : none;
}
#primary-nav li:hover ul, 
#primary-nav ul li:hover ul, 
#primary-nav ul ul li:hover ul, 
#primary-nav li.menuparenth ul,
#primary-nav ul li.menuparenth ul, 
#primary-nav ul ul li.menuparenth ul {
    display : block;
}
#primary-nav li li {
    float : left;
    clear : both;
}
#primary-nav li li a {
    height : 1%;
} 

---

[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog  /   Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox