Navigation hover

[im-takt]

Guten tag liebes Forum,

ich hab folgendes Problem, ich will das sich der Hintergrund meiner Navigation Grau bleibt und auf der stelle wo die Maus ist sollte sie dieses Gold-Orange haben .. ich glaube das ich irgendwo einen kleinen Fehler hab den ich nicht erkenn :) .. ich wäre froh wenn mir jemand helfen könnte

hier der Link: http://www.im-takt.at/imtakt/

und die CSS:

<style type="text/css">
/*<![CDATA[*/

<link rel="stylesheet" href="style.css" type="text/css" />

nav {
    width: 960px;
}
nav ul {
    padding: 00px;
    margin: 00px;
}
nav ul:after {
    clear: both;
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    visibility: hidden;
   
}
    nav ul,nav ul li{
    background-color: #555555;
    opactiy: .5;
   
}
    nav ul li {
    list-style: none;
    float:left;
}
nav ul li a {
    text-decoration: none;
    display: block;
    color: #555555;
    padding: 14px 34px 14px 34px;
}
nav ul li:hover > ul {
    visibility: visible;
}
nav ul li ul{
    display: inline;
    visibility: hidden;
    position: absolute;
    padding:0px;
}
nav ul li ul li{
    float: none;
}
nav ul li ul li a:hover{
    color: #000000;
}
nav ul {
    padding: 0px;
    margin: 0px;
    box-shadow: 2px 2px 2px #888383;
    -moz-box-shadow: 2px 2px 2px #888383;
    -webkit-box-shadow: 2px 2px 2px #888383;
}
nav ul li {
list-style: none;
    float:left;
    border-right: 1px solid #555555;
}
nav ul li a {
    text-decoration: none;
    display: block;
    color: #000000;
    padding: 14px 34px 14px 34px;
    transition: background 0.3s ease-out; /* explorer 10 */
    -webkit-transition: background 0.3s ease-out; /* chrome & safari */
    -moz-transition: background 0.3 ease-out; /* firefox */
    -o-transition: background 0.3 ease-out; /* opera */
}
nav ul li.cat1:hover a, nav ul li.cat1:hover > ul li a  {
    background-color: #daa520;
}
nav ul li.cat2:hover a, nav ul li.cat2:hover > ul li a  {
    background-color: #daa520;
}
nav ul li.cat3:hover a, nav ul li.cat3:hover > ul li a {
    background-color: #daa520;
}
nav ul li.cat4:hover a, nav ul li.cat4:hover > ul li a {
    background-color: #daa520;
}
nav ul li.cat5:hover a, nav ul li.cat5:hover > ul li a {
    background-color: #daa520;
}
nav ul li.cat6:hover a, nav ul li.cat6:hover > ul li a {
    background-color: #daa520;
}
nav ul li.cat7:hover a, nav ul li.cat7:hover > ul li a {
    background-color: #daa520;
}
nav ul li:hover > a {
    color: #000000;
}
nav ul li ul li a {
    color: #000000;
}
nav ul li ul li a:hover{
    color: #000000;
    background-color: #ffffff !important;
}

#menu {
  font-size:14px;
  position:absolute;
  font-family: Montaga;
  opacity: 0.86;
  margin-left: 40px;
  top: 140px;
  z-index: 15;

}

/*]]>*/
</style>

 

[threadi]

Genau das was Du beschreibst wie es sein soll passiert bei mir im Firefox. Kann also dein Problem nicht nachvollziehen?!

 

[im-takt]

ja es funktioniert schon, aber wenn du jetzt zum Beispiel auf der Navigation, mit der Maus auf Workshop fährst, dann ist die ganze Unterseite ( Workshop-plan, Voranmelden) in dem gold-orange. Sie sollte aber auch grau bleiben und erst wenn du mit der Maus auf die Unterseite ( Workshop-plan, Voranmelden) fährst sollte die jeweilige Unterseite gold-orange werden. und die Hauptgruppe (Workshop in diesem Fall) auf grau umsteigen.

 

[im-takt]

ähnlich wie hier http://www.baumaxhaus.at

 

[bdt600]

Arbeite das mal ab, vielleicht hilft es: http://validator.w3.org/check?verbose=1&uri=http://www.im-takt.at/imtakt/