Hallo zusammen
Ich bin in Sachen Programmieren der "lerning by doit" Typ. Und dementsprechen komme ich immer wider an meine Grenzen. (Aber daraus kann mann was lernen :wink: )
Mein Problem
Auf meiner Homepage, bin ich am versuchen eine Seitennavigation aufzubauen. Sie ist noch nicht fertig und funktioniert auch noch nicht richtig, aber die richtung stimmt.
Jedoch habe ich das Problem, das wenn mann mit der Maus über die Navigation geht, die zweite Reihe der Navigation durchsichtig ist. Das heisst der Hintergrund (Text) schimmert durch.
Ich habe alles versucht doch ich komme nicht darauf dies abzustellen, dass heisst die navigation als oberstes Element hinzubekommen.
Kann mir jemand helfen?
Danke im vorraus
Hier der Link: http://www.s-kohler.ch/JW
Hier sonst noch der Code dazu:
div#Tmenu { font-size: 110%;
width: 10em;
padding: 0.8em;
border: 0px solid white;
background-color:rgba(255, 255, 255, 0); }
* html div#Tmenu {
width: 11.3em;
width: 10em; /* (IE 6 in standards-compliant mode) */
}
ul#Navigation {
margin: 0; padding: 0.8;
text-align: center;
}
ul#Navigation li {
list-style: none;
position: relative;
margin: 0.4em; padding: 0;
}
* html ul#Navigation li {
margin-right:1.5em; /* Platz fuer Link-Verbreiterung im IE reservieren */
margin-bottom:0;
}
ul#Navigation li ul {
margin: 0; padding: 0;
position: absolute;
top: 0; left: 9em;
}
ul#Navigation li ul li {
margin: 0; padding-left: 1.4em;
}
ul#Navigation a, ul#Navigation span {
display: block;
width: 7em;
font-family:"Comic Sans MS", "Trebuchet MS", "Century Gothic", Helvetica, Arial, sans-serif;
text-decoration: none; font-weight:bold;
padding: 0.9em 1em;
border: 1px solid #900;
border-left-color:rgba(255, 255, 255, 0) ; border-top-color:rgba(255, 255, 255, 0) ;
color: black; ;
}
* html ul#Navigation a, * html ul#Navigation span {
width: 9em;
width: 7em; /* (IE 6 in standards-compliant mode) */
}
li a#schwarz {
border-right-color:rgba(0, 0, 0,.4); border-bottom-color:rgba(0, 0, 0,.4);
background-color:rgba(0, 0, 0,.1);
}
li a#schwarz:hover, li a#schwarz2 {
border-left-color:rgba(0, 0, 0,.0); border-top-color:rgba(0, 0, 0,.0);
border-right-color:rgba(0, 0, 0,.4); border-bottom-color:rgba(0, 0, 0,.4);
background-color:rgb(0, 0, 0);
color:white ;
}
li a#grün{
border-right-color:rgba(0, 0, 0,.4); border-bottom-color:rgba(0, 0, 0,.4);
background-color: rgba(0,132,0,.4);
}
li a#grün:hover, li a#grün2 {
border-left-color:rgba(0, 0, 0,.0); border-top-color:rgba(0, 0, 0,.0);
border-right-color:rgba(0, 0, 0,.4); border-bottom-color:rgba(0, 0, 0,.4);
background-color: rgba(0,132,0,.9);
}
li a#blau {
border-right-color:rgba(0, 0, 0,.4); border-bottom-color:rgba(0, 0, 0,.4);
background-color: rgba(0,0,131,.4);
}
li a#blau:hover, li a#blau2 {
border-left-color:rgba(0, 0, 0,.0); border-top-color:rgba(0, 0, 0,.0);
border-right-color:rgba(0, 0, 0,.4); border-bottom-color:rgba(0, 0, 0,.4);
background-color: rgba(0,0,131,.9);
color:white ;
}
li a#gelb {
border-right-color:rgba(0, 0, 0,.4); border-bottom-color:rgba(0, 0, 0,.4);
background-color: rgba(253,253,0,.4);
}
li a#gelb:hover, li a#gelb2 {
border-left-color:rgba(0, 0, 0,.0); border-top-color:rgba(0, 0, 0,.0);
border-right-color:rgba(0, 0, 0,.4); border-bottom-color:rgba(0, 0, 0,.4);
background-color: rgba(253,253,0,.9);
}
li a#orange {
border-right-color:rgba(0, 0, 0,.4); border-bottom-color:rgba(0, 0, 0,.4);
background-color: rgba(251,131,62,.4);
}
li a#orange:hover, li a#orange2 {
border-left-color:rgba(0, 0, 0,.0); border-top-color:rgba(0, 0, 0,.0);
border-right-color:rgba(0, 0, 0,.4); border-bottom-color:rgba(0, 0, 0,.4);
background-color: rgba(251,131,62,.9);
}
li a#rot {
border-right-color:rgba(0,0,0,.4); border-bottom-color:rgba(0, 0, 0,.4);
background-color: rgba(254,0,0,.4);
}
li a#rot:hover, li a#rot2 {
border-left-color:rgba(0, 0, 0,.0); border-top-color:rgba(0, 0, 0,.0);
border-right-color:rgba(0, 0, 0,.4); border-bottom-color:rgba(0, 0, 0,.4);
background-color: rgba(254,0,0,.9);
}
/* dynamisches Ein-/Ausblenden */
ul#Navigation li ul {
display: none;
}
ul#Navigation li:hover>ul {
display: block;
}
ul#Navigation>li:hover>a {
width: 8.2em;
}
/* dynamisches Ein-/Ausblenden der JavaScript-generierten Klasse im IE */
* html ul#Navigation li.hoverIE {
margin-right:0; /* reservierten Platz freigeben */
margin-bottom:-1.15em; /* Fehlerkorrektur, ggfls. anpassen */
}
* html ul#Navigation li.hoverIE ul {
display: block;
}
* html ul#Navigation li .hoverIE {
width: 10.3em;
width: 8.2em; /* (IE 6 in standards-compliant mode) */
}