any CSS gurus around? - Tilted Forum Project Discussion Community

jmack · 11-09-2005, 07:22 AM

I hope so!

have a look at this please: http://www.digitallsd.com/test_css.htm

Okay so in IE it works perfectly. It displays the table background color transluscent over the image background while keeping the contents of the table at 100% alpha. Perfect.

In Firefox however, it makes the table bg AND its contents transluscent. I dont want that.

Is there a work around for this?

phukraut · 11-09-2005, 03:36 PM

I'm no CSS guru, but what happens when you remove all the errors as listed here:

Validator Results?

DiegoAndresJAY · 11-17-2005, 07:37 PM

<html>
<head>
<style type="text/css">

.transBg{
background-color: #000000;
border: 1px solid #9D6F39;
filter:alpha(opacity=40);
opacity: 0.4;
-moz-opacity:0.4;
z-index: 0;
position: absolute;
}
.transInner {
font-size: 11px;
color: #BA9D7C;
font-family: Arial, Helvetica, sans-serif
filter:alpha(opacity=100);
opacity: 1;
-moz-opacity:1;
position: relative;
}
body{
background-image: url(http://images.lottadot.com/shane/pho...l-flower-i.png);
}
</style>
</head>
<body>
<table width="400" height="400" class="transBg"><tr><td> </td></tr></table>
<table width="400" height="400">
<tr>
<td class="transInner" align="center">
<table class="opaqueBg"><tr><td>
<img src="http://images.lottadot.com/shane/photos/flowers/orange-spikey-ball-flower-i.png" height="200" width="200"><br>
This is the test text for this css thing.
</td></tr></table>
</td>
</tr>
</table>
</body>
</html>

11-09-2005, 07:22 AM	#1 (permalink)
jmack Upright Location: Detroit	any CSS gurus around? I hope so! have a look at this please: http://www.digitallsd.com/test_css.htm Okay so in IE it works perfectly. It displays the table background color transluscent over the image background while keeping the contents of the table at 100% alpha. Perfect. In Firefox however, it makes the table bg AND its contents transluscent. I dont want that. Is there a work around for this?

11-17-2005, 07:37 PM	#3 (permalink)
DiegoAndresJAY Upright	This Should Work... <html> <head> <style type="text/css"> .transBg{ background-color: #000000; border: 1px solid #9D6F39; filter:alpha(opacity=40); opacity: 0.4; -moz-opacity:0.4; z-index: 0; position: absolute; } .transInner { font-size: 11px; color: #BA9D7C; font-family: Arial, Helvetica, sans-serif filter:alpha(opacity=100); opacity: 1; -moz-opacity:1; position: relative; } body{ background-image: url(http://images.lottadot.com/shane/pho...l-flower-i.png); } </style> </head> <body> <table width="400" height="400" class="transBg"><tr><td> </td></tr></table> <table width="400" height="400"> <tr> <td class="transInner" align="center"> <table class="opaqueBg"><tr><td> <img src="http://images.lottadot.com/shane/photos/flowers/orange-spikey-ball-flower-i.png" height="200" width="200"><br> This is the test text for this css thing. </td></tr></table> </td> </tr> </table> </body> </html> Last edited by DiegoAndresJAY; 11-17-2005 at 07:39 PM..

11-09-2005, 03:36 PM	#2 (permalink)
phukraut Addict	I'm no CSS guru, but what happens when you remove all the errors as listed here: Validator Results?