-moz-opacity und DIV mit overflow
blackICE
- css
0 Axel Richter0 blackICE
Hallo,
ich habe ein Problemchen mit dem folgenden Code und Firefox (mit IE ist alles klaro),wenn ich über die Menüs gehe.
Hat jemand eine Idee, wie ich dieses (D)Effekt vermeiden kann??
Dank im voraus!!
Das ist das Beispiel:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">
<html><head><title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#frame {
width: 750px;
height: 500px;
margin-right:auto;
margin-left:auto;
margin-top: 0px;
padding:0px;
text-align:center;
background-color:#eee;
margin-bottom: 0px;
padding-bottom: 0px;
}
#contentleft {
width: 200px;
height: 500px;
padding:0px;
margin-left: 0px;
float:left;
background-color: Blue;
text-align:left;
}
#contentleft ul{
margin: 0px;
padding: 0px;
list-style-type:none;
text-indent:0;
width:200px;
padding-top: 50px;
}
#contentleft li{
margin: 0px;
padding: 0px;
list-style-type:none;
text-indent:0;
}
#contentleft ul li a {
text-decoration:none;
display:block;
color: Green;
margin: 0;
padding:0px 0px 0px 10px;
height: 20px;
border-bottom: 1px #FFFFFF dotted;
}
#contentleft ul li a:hover {
background:#efefef;
color: #000000;
border-bottom: 1px dotted #ffffff;
margin: 0px;
FILTER: alpha(opacity = 60);
-moz-opacity: 0.6;
}
#contentcenter {
width: 450px;
height: 470px;
padding:0px;
background: #eee;
padding-left: 10px;
font-size: 12px;
text-align:left;
float:left;
padding-top: 30px;
padding-left: 20px;
}
</style>
</head><body>
<div id="frame">
<div id="contentleft">
<ul>
<li> <a href="#">Home</a></li>
<li> <a href="#">Home</a></li>
</ul>
</div>
<div id="contentcenter">
<br/><br/>
<div id="input" style=" width: 470px; height: 350px; overflow: scroll;">
Gordon Brown is continuing his bid to persuade ministers from the G7 group of industrialised nations to back his plan to tackle debt in developing countries.
<br/><br/>
The UK chancellor wants to provide $10bn (£5.38bn) a year over a decade, using G7 backing so the money could be borrowed up front on financial markets.
</div>
</div><br clear="all" />
</div>
</body>
</html>
Hallo,
ich habe ein Problemchen mit dem folgenden Code und Firefox (mit IE ist alles klaro),wenn ich über die Menüs gehe.
Hat jemand eine Idee, wie ich dieses (D)Effekt vermeiden kann??
Bitte beim nächsten Mal den Effekt beschreiben, danke.
#contentleft ul li a {
^Das li ist überflüssig. In UL dürfen ohnehin nur LI stehen.
text-decoration:none;
display:block;
color: Green;
margin: 0;
padding:0px 0px 0px 10px;
height: 20px;
border-bottom: 1px #FFFFFF dotted;
}
#contentleft ul li a:hover {
background:#efefef;
color: #000000;
border-bottom: 1px dotted #ffffff;
^Bitte hier nur die Eigenschaften verändern, die sich _wirklich_ ändern. Diese kann weg.
margin: 0px;
^Bitte hier nur die Eigenschaften verändern, die sich _wirklich_ ändern. Diese kann weg.
FILTER: alpha(opacity = 60);
-moz-opacity: 0.6;
}
Zum Problem. Offensichtlich wird das Objekt bei Änderung von -moz-opacity: 1; auf eine kleinere opacity kurz ausgeblendet. Schreibe in den Selector #contentleft ul a die Eigenschaft -moz-opacity: 0.9999;.
viele Grüße
Axel
Vielen Dank!!!
Es hat funktioniert!!!
Ich habe vorher mit "-moz-opacity: 1;" experementiert, es hat aber nicht geholfen :-(
Best Regards
Martin alias blackICE ;-)