Hello,
after spending all night online trying to solve the problem -with only minimal knowledge of css!-, I've got the next really simple solution:
(I didn 't use an external stylesheet, but anyone who can explain to me how it works is welcome)
-build 2 tables which exactly overlap each other. The magnificent 'z-index' makes that possible. Make the first table the one with transparency:
><div id="layer1" style="position: absolute; top: 8px; left: 0%; width: 99%; height: 100px; z-index: 1; border: 0px solid gray; color: #CC0066">
<table width="80%" cellspacing="2" cellpadding="2" border="2" align="center">
<tr>
<td style="filter: Alpha (Opacity=50); -moz-opacity: .5;" bgcolor="#EBAAA5" width="50%" height="40"></td>
<td style="filter: Alpha (Opacity=50); -moz-opacity: .5;" bgcolor="#EBAAA5"></td>
</tr>
</table>
</div>
<div id="layer2" style="position: absolute; top: 8px; left: 0%; width: 99%; height: 100px; z-index: 2; border: 0px solid black;">
<table width="80%" cellspacing="2" cellpadding="2" border="2" align="center">
<tr>
<td width="50%" height="40"><font face="verdana" size="2"><b>Oh, this is fantastic!</b></font></td>
<td><center><font face="verdana" size="2"><b>This works for Firefox and IE.</b></font></center></td>
</tr>
</table>
</div>
the first layer 'layer1' with z-index 1 contains background transparency settings for Firefox & Mozilla (-moz-opacity: .x) and for IE (filter: Alpha (Opacity=xx)).
the 2nd layer 'layer2' with z-index 2 comes on the foreground. It contains everything you want to be at 100% opacity, like text which must be readable.
Of course, add a background image to see the stunning results better!
a working version can be seen at good guitar chords in Word
hope to have helped you out!
