• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Menü will einfach nicht zentrieren?!

hinkel11

Neues Mitglied
Gelöst: Menü will einfach nicht zentrieren?!

Hallo,

ich bekomme es einfach nicht hin das Menü auf der unten angegebenen Seite zu zentrieren. Ich dachte es würde genügen die Liste einfach mit einem div-Container zu umschliessen und diesem margin: 0 auto zuzuweisen. Klappt aber nicht. Nicht mal Firebug hat mir hier weitergeholfe. Hat auf jeden Fall irgendwie mit dem float: left zu tun.
Hat jemand einen Tip?
Danke.

Hier die Seite:
Test
 
Zuletzt bearbeitet:
setz' mal ein text-align:center; IM blockelement. wenn das nicht geht, versuche, die <ul> direkt anzusprechen.

Nils aka XraYSoLo
 
Das mit dem text-align: center klappt nicht, weder im umschließenden div-Container noch in der ul direkt. Habs jetzt mit text-align:center und margin: 0 auto probiert, auch beides mit important Anweisung. Dass was Firebug als "cssMenu cssMenum" anzeigt existiert in der css-Datei so nicht, hat aber denke ich auch nichts mit dem Problem zu tun.
Was könnte ich sonst noch probieren?

Hier mal der Code der dazugehörigen css-Datei:
Code:
ul.cssMenu ul{display:none}
ul.cssMenu li:hover>ul{display:block}
ul.cssMenu ul{position: absolute;left:-1px;top:98%;}
ul.cssMenu ul ul{position: absolute;left:98%;top:-2px;}
ul.cssMenu,ul.cssMenu ul {
    margin:0px;
    list-style:none;
    padding:0px 2px 2px 0px;
    background-color:#ffffff;
    background-repeat:repeat;
    border-color:#AAAAAA;
    border-width:1px;
    border-style:solid;
}
ul.cssMenu table {border-collapse:collapse}ul.cssMenu {
    display:block;
    zoom:1;
    float: left;
}
ul.cssMenu ul{
    width:147px;
}
ul.cssMenu li{
    display:block;
    margin:2px 0px 0px 2px;
    font-size:0px;
}


ul.cssMenu a:active, ul.cssMenu a:focus {
outline-style:none;
}
ul.cssMenu a, ul.cssMenu li.dis a:hover, ul.cssMenu li.sep a:hover {
    display:block;
    vertical-align:middle;
    background-color:#ffffff;
    border-width:0px;
    border-color:#6655ff;
    border-style:solid;
    text-align:left;
    text-decoration:none;
    padding:4px;
    _padding-left:0;
    font:normal 11px Verdana;
    color: #444444;
    text-decoration:none;
    cursor:default;
}
ul.cssMenu span{
    overflow:hidden;
}
ul.cssMenu li {
    float:left;
}
ul.cssMenu ul li {
    float:none;
}
ul.cssMenu ul a {
    text-align:left;
    white-space:nowrap;
}
ul.cssMenu li.sep{
    text-align:center;
    padding:0px;
    line-height:0;
    height:100%;
}
ul.cssMenu li.sep span{
    float:none;    padding-right:0;
    width:5;
    height:16;
    display:inline-block;
    background-color:#AAAAAA;    background-image:none;}
ul.cssMenu ul li.sep span{
    width:80%;
    height:3;
}
ul.cssMenu li:hover{
    position:relative;
}
ul.cssMenu li:hover>a{
    background-color:#FF0000;
    border-color:#665500;
    border-style:solid;
    font:normal 11px Verdana;
    color: #ffffff;
    text-decoration:none;
}
ul.cssMenu li a:hover{
    position:relative;
    background-color:#FF0000;
    border-color:#665500;
    border-style:solid;
    font:normal 11px Verdana;
    color: #ffffff;
    text-decoration:none;
}
ul.cssMenu li.dis a {
    color: #AAAAAA !important;
}
ul.cssMenu img {border: none;float:left;_float:none;margin-right:4px;width:16px;
height:16px;
}
ul.cssMenu ul img {width:16px;
height:16px;
}
ul.cssMenu img.over{display:none}
ul.cssMenu li.dis a:hover img.over{display:none !important}
ul.cssMenu li.dis a:hover img.def {display:inline !important}
ul.cssMenu li:hover > a img.def  {display:none}
ul.cssMenu li:hover > a img.over {display:inline}
ul.cssMenu a:hover img.over,ul.cssMenu a:hover ul img.def,ul.cssMenu a:hover a:hover img.over{display:inline}
ul.cssMenu a:hover img.def,ul.cssMenu a:hover ul img.over,ul.cssMenu a:hover a:hover img.def{display:none}
ul.cssMenu a:hover ul{display:block}
ul.cssMenu span{
    display:block;
    background-image:url(arrv_anim_1.gif);
    background-position:right center;
    background-repeat: no-repeat;
   padding-right:11px;}
ul.cssMenu li:hover>a>span{    background-image:url(arrv_anim_1o.gif);
}
ul.cssMenu a:hover span{    _background-image:url(arrv_anim_1o.gif)}
ul.cssMenu ul span,ul.cssMenu a:hover table span{background-image:url(arr_double_1.gif)}
ul.cssMenu ul li:hover > a span{    background-image:url(arr_double_1o.gif);}
ul.cssMenu table a:hover span{background-image:url(arr_double_1o.gif)}
 
Mit der fehlerhaften CSS hattest du recht. Lag daran, dass das CSS-Menü von einem Online-Generator stammt, der anscheinend wohl nichts taugt. Die Fehler sind nun aber korrigiert, zumindest die in der relevanten CSS-Datei. Alle anderen aufgelisteten Fehler beziehen sich auf Eigenschaften die nur für Mozilla zutreffen und noch nicht als valide gelten. Diese brauche ich jedeoch. Aber egal, denn daran liegt es sicher nicht.

Gibts vielleicht noch eine andere Möglichkeit?
 
Zurück
Oben