Opacity i dropdown menu
Jeg har lavet en dropdown menu med, hvor jeg gerne vil have den til at have en opacity på 90%, men når jeg ser den i browseren, hvor den "dropper" ned over feks et billede, ser man at den ikke er gennemsigtig over billedet, men som om at den har en hvid baggrund bag sig som man kan se igennem, hvilket gør at en bare får en lysere grå farve. Håber i forstår hvad jeg mener (:Her er min kode:
@charset "utf-8";
/* CSS Document */
#cssmenu {
background-image:url(ddbg.gif);
background-repeat:repeat-x;
}
#cssmenu > ul {
padding: 0;
margin: 0;
list-style: none;
width: 960px;;
height: 25px;
font: normal 10px arial, helvetica;
line-height: 25px;
}
#cssmenu > ul li {
height: 25px;
margin:0;
padding:0;
display:block;
float:left;
position:relative;
padding-left: 15px;
padding-right: 15px;
border-right: 1px solid #454545;
}
#cssmenu > ul li a:link, #cssmenu > ul li a:visited, #cssmenu > ul li:hover a, #cssmenu > ul li a:hover, #cssmenu > ul li a:active {
text-decoration:none;
color:#ffffff;
}
#cssmenu > ul li ul {
margin: 0;
padding: 0;
list-style:none;
display:none;
position:absolute;
top:25px;
left:0px;
}
#cssmenu > ul li:hover ul {
display:block;
}
#cssmenu > ul li ul li {
padding: 10px;
width: auto;
height: auto;
border:none;
background-image:url(ddbg2.png);
background-repeat: repeat;
}
#cssmenu > ul li ul li a:link, #cssmenu > ul li ul li a:visited, #cssmenu > ul li ul li:hover a, #cssmenu > ul li ul li a:active, #cssmenu > ul li ul li a:hover {
clear:left;
background:#333333;
padding: 0;
width:146px;
border:none;
position:relative;
z-index:1000;
}
#cssmenu > ul li ul li textarea {
width: 450px;
height: 120px;
padding: 10px;
border: none;
}
#cssmenu > ul li ul li input {
font-size: 10px;
padding: 5px;
border: none;
background: #ffffff;
}
Html:
<div id="cssmenu">
<ul>
<li><a href='#'>SKRIV BESKED</a>
<ul>
<li><textarea rows="10" cols="30" placeholder="Skriv din besked her."></textarea><input type="submit" value="SEND"></li>
</ul>
</li>
<li><a href='#'>DEL MED EN VEN</a>
<ul>
<li><textarea rows="10" cols="30">Hej. Se lige den her person jeg har fundet. Han/hun ser interessant ud! (:</textarea><input type="submit" value="SEND"></li>
</ul>
</li>
<li><a href='#'>PUNKT 3</a></li>
<li><a href='#'>PUNKT 4</a></li>
<li><a href='#'>PUNKT 5</a></li>
</ul>
</div>
Mit eget gæt er at den arver en hvid baggrund fra parent element, men kan simpelthen ikke gennemskue hvor. Det er png-filen ddbg2 der er gennemsigtig. Har naturligvis også prøvet med opacity 0.9, med præcis samme resultat.
Håber der er en klog person der kan kaste lys over det. (: