Průhlednost bez použití obrázku

Rád bych zprůhlednil prvky na stránce bez použití obrázků.

Použil jsem tento kod(níže) pro pozadí položek 2. a 3. urovně v hover menu.
.xyz {filter: alpha(opacity=75); opacity: 0.75;}

V Mozila Firefoxu a Safari (starší verze) vše funguje jak má, v poslední verzi opera 9.24(ostatní verze jsem nezkoušel) vše funguje ideálně také, avšak v IE5-6(7 jsem nezkoušel) se 3. úroven nabídky po zprůhlednění (75%) nerozbalí.

Potřeboval bych znát příčinu problémů s IE a případné možné řešení, ocením seznam opatření(pokud jich je víc), které bych měl podniknout, pokud by se měla průhlednost projevit v co největším množství starších verzích prohlížečů(výjmku tvoří hodně staré verze, které dnes nepoužívá téměř nikdo <IE5, netscape, <opera5 apod..) nebo odkaz na nejlépe českou stránku s podobným(i) seznamem(y).

Předem děkuji.

Zvláštní, bez odpovědi - potřeboval bych alspon zjistit, proč se IE chová v tomto případě jinak (vyhněte se prosím frází jako [/i]'Protože je to prostě IE, protože je IE horší prohlížeč apod...' - zajímá mě konkrétní důvod[i])

Zvláštní, bez odpovědi - potřeboval bych alspon zjistit, proč se IE chová v tomto případě jinak (vyhněte se prosím frází jako [/i]'Protože je to prostě IE, protože je IE horší prohlížeč apod...' - zajímá mě konkrétní důvod[i]).

Nechtěné, několikanásobné odeslání - omlouvám se.

Bubák
Chápu, nicméně mám kod v počítači. Nejspíše ho stejně někam hodím, ale spoléhal jsem na to, že se najde člověk, který již na tento problém narazil a ví, proč se IE takto chová - zasílám kod(neúplný - nebudu definovat základní, vertikální nabídku, která nemá být průhledná).







HTML
<ul class="menu">
<li class="top"><a href="#" id="home" class="firstmenu"><span>Home</span></a></li>
<li class="top"><a href="#" id="aaaaa" class="firstmenu"><span class="down">aaaaa</span><!--[if gte IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul class="sub">
<li><a href="../menu/">a<!--[if gte IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul class="sub">
<li><a href="../menu/">aa</a></li>
<li><a href="../boxes/">bb</a></li>
<li><a href="../mozilla/">cc</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="../boxes/">b</a></li>
<li><a href="../mozilla/">c</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>


CSS
.menu :hover ul :hover ul, .menu :hover ul :hover ul :hover ul {left:2px; top:40px; width:100px; height:auto;}
.menu ul, .menu :hover ul ul, .menu :hover ul :hover ul ul
{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}
.menu table {border-collapse:collapse; width:0; height:0; position:absolute; top:0; left:0;}
.menu :hover ul.sub {left:2px; top:40px; background: #fff; white-space:nowrap; width:100px; height:auto; filter: alpha(opacity=75); opacity: 0.75;}
.menu :hover ul.sub li {display:block; height:20px; position:relative; float:left; width:90px;}
.menu :hover ul.sub li a {display:block; height:20px; width:100px; line-height:20px; text-indent:5px; color:#000;}
.menu :hover ul.sub li a:hover {background:#000; color:#fff;}

Je možné, že problém bude v !DOCTYPE ? - Myslím, že ne, ale pokud ano, tak prosím uvedte co přesně zde vadí, později to stejně změním na 4.01.
XHTML 1.0 Strict