Developer forum

You can do that by using a transparent PNG image of the shadow as a backgound for your DIV. Just note that this does not work well in IE and older browsers that miss the PNG support.

ralf@fonqi.dk wrote:
hi any good answers how to make a nice shadow effect on a div tag ontop of a background picture so that a page seeems to hover abit over the site?

bg@degngrafik.dk wrote:
You can do that by using a transparent PNG image of the shadow as a backgound for your DIV. Just note that this does not work well in IE and older browsers that miss the PNG support.

ralf@fonqi.dk wrote:
hi any good answers how to make a nice shadow effect on a div tag ontop of a background picture so that a page seeems to hover abit over the site?

A way to obtain PNG support in IE6 can be found here:
http://bjorkoy.com/post/show/8

hey But is png ok with safari? - sometime it seems to fuck a bit up?

ralf@fonqi.dk wrote:
hey But is png ok with safari? - sometime it seems to fuck a bit up?

I don't think it's a problem in Safari 2, but in earlier version I don't know.

// Sebastian

Well you can also use filters via css to make an div transparent.

Exampel - made only with javascript and css

Link to stylesheet
Dont mind the slacky css on the page its some time ago i made this site - was during my study. But it works:

.container {
background-color: #645D59;
height: 0px;
width: 457px;
z-index: 100;
filter: alpha(Opacity=69);
-Moz-Opacity: 0.69;
position: absolute;
top: -15px;
left: 491px;
}
.containertext {
position: absolute;
top: 100px;
left: 515px;
width: 416px;
height: 430px;
z-index: 101;
color: #FFFFFF;
filter: alpha(Opacity=0);
-Moz-Opacity: 0.00;
}

I use both filter and -Moz since i wanted it to work in both IE and FF.

Hope this can help abit.

/J