Webdev Opacity Filters for IE and Mozilla/NScape (full code)

[altofran]

This is the full code (see http://pbase.com/nacef)

Code: Select all

a,
a:link,
a:visited,
a:active
{
   color: rgb(204, 204, 255);
   text-decoration: none;
   font-weight: bold;
}

a:hover
{
   color: rgb(95, 121, 216);
   text-decoration: none;
}

a.thumbnail,
a.thumbnail:link,
a.thumbnail:visited,
a.thumbnail:active
{
   border: rgb(0, 0, 0) 1px solid;
   margin-bottom: -45px;
   padding-top: 5px;
   display: block;
   background: rgb(35, 35, 35);
   width: 190px;
   height: 210px;
   -moz-opacity:0.75;
   filter: Alpha(Opacity=75);
}

a.thumbnail:hover
{
   border: rgb(95, 121, 216) 1px solid;
   margin-bottom: -45px;
   padding-top: 5px;
   display: block;
   background: rgb(32, 32, 32);
   width: 190px;
   height: 210px;
   -moz-opacity:1.0;
   filter: Alpha(Opacity=100);
}

body
{
   margin-bottom: 20px;
   margin-top: 0px;
   background: rgb(61, 61, 61);
}

div,
body,
th,
tr,
table,
li,
ul,
form,
blockquote,
p,
b,
i,
h4,
center
{
   border: 0px;
   color: rgb(184, 184, 204);
   font: 12px Verdana, Arial, Helvetica, sans-serif;
}

font
{
   border: 0px;
   margin-left: 4px;
   margin-right: 4px;
   font: 11px Verdana, Arial, Helvetica, sans-serif;   
   letter-spacing: 0px;
}

h1, h2
{
   border: rgb(95, 121, 216) 1px solid;
   border-left: 1px none;
   border-right: 1px none;
   border-top: 1px none;
   margin-bottom: 1em;
   margin-left: -10px;
   margin-right: 0px;
   padding: 5px;
   width: 100%;
   display: block;
   background: rgb(0, 0, 0);
   color: rgb(204, 204, 255);
   font: bolder 20px Verdana, Arial, Helvetica, sans-serif;
   letter-spacing: 4px;
   text-align: right;
   position: relative;
   filter: progid:DXImageTransform.Microsoft.gradient(gradientType=1,enabled='true',startColorstr='#000000',endColorstr='#2D2D2D');
}

h3
{
   border-bottom: rgb(0, 0, 0) 1px dotted;
   border-left: 1px none;
   border-right: 1px none;
   border-top: 1px none;
   padding: 2px;
   width: 400px;
   display: block;
   background: rgb(40, 40, 40);
   color: rgb(184, 184, 204);
   font: normal 12px Verdana, Arial, Helvetica, sans-serif;
   letter-spacing: 0px;
   text-align: center;
}

h5
{
   border: 0px;
   padding-left: 2px;
   width: 150px;
   display: block;
   color: rgb(204, 204, 255);
   font: normal 12px Verdana, Arial, Helvetica, sans-serif;
   filter: progid:DXImageTransform.Microsoft.gradient(gradientType=1,enabled='true',startColorstr='#000000',endColorstr='#2D2D2D');
}

img
{
   border: rgb(0, 0, 0) 1px none;
}

img.thumbnail
{
   border: rgb(0, 0, 0) 1px solid;
   margin: 0px;
   padding: 0px;
   background: rgb(45, 45, 45);
   vertical-align: middle;
}

input
{
   border: rgb(0, 0, 0) 1px solid;
}

table.thumbnail
{
   width: 10%;
}

td
{
   border: 1px none;
   background: none;
   border-collapse: collapse;
   empty-cells: show;
}

td.message_body
{
   border-bottom: rgb(0, 0, 0) 1px dotted;
   border-left: 1px none;
   border-right: 1px none;
   border-top: 1px none;
   display: block;
   background: rgb(40, 40, 40);
}

.caption
{
   color: rgb(95, 121, 216);
   font-size: 12px Verdana, Tahoma, Helvetica, sans-serif;
   font-style: italic;
}

.display
{
   border: rgb(0, 0, 0) 1px solid;
   margin-top: 1em;
   background: rgb(0, 0, 0);
   filter:Shadow(color="#141414",Direction=135,Strength=5);
}

.lid
{
   background: rgb(55, 55, 55);
   color: rgb(102, 102, 102);
   font: 11px Verdana, Tahoma, Helvetica, sans-serif;
   text-decoration: none;
}

.message_body
{
   margin: 5px 5px 10px;
   color: rgb(184, 184, 204);
   font: 10px Verdana, Tahoma, Helvetica, sans-serif;
}

.sb
{
   background: rgb(91, 91, 101);
   color: rgb(204, 204, 255);
   font: 12px Verdana, Tahoma, Helvetica, sans-serif;
   text-decoration: none;
}

BODY { margin-top: 0px;}
HR { position : relative;}

[/code]

[srijith]

Works as expected in IE 6.01, Firebird 0.6. In Opera 7.11, opacity fails, and you know what, I like what I see in Opera than what I see in IE/Firebird. I just hate the opacity

Nice work.