Here's a problem I've been working with all morning. Not sure there is a fix, though. I've searched Google and read tons of stuff to no avail.
I'm using CSS opacity to make a table cell background transparent. I then nest a table inside that table cell, and put text into the newly nested table. Well, the text in the new table inherits the opacity value. But I don't want the text to be transparent like the background. I want it to have full color.
Here is the code:
background-position: right bottom;
font-family: "Trebuchet MS", Arial;
><td height="77px" align="right" valign="bottom" id="headRight">
<table width="310" border="0" cellspacing="0" cellpadding="0" style="position: relative">
<td width="46" align="center">
<a id="smallNavLinks" href="http://www.harmonymedical.co.uk">HOME</a></td>
The opacity rules in #smallNavLinks set the opacity according to that of the parent element. Therefore, 100% = 50%, since the parent element has an opacity of 50%.
There is a workaround for this in IE, but I can't fix it in Mozilla. If anyone has any ideas...???
I hope I explained it properly. It's not an easy problem to put words to!