CMS Made Simple Forums

Posted: **Thu Aug 02, 2007 6:05 pm**

Hey,

I want to add shadow (using CSS) to a block, created in CSS.
I use this CSS code :

#info {
display: block;
width: 150px;
border-top: 20px solid #feecde;
border-right: 1px solid #fccba8;
border-bottom: 1px solid #fccba8;
border-left: 1px solid #fccba8;
margin: 10px;
padding: 10px;
filter:shadow(color=#333333, direction=135);

background-image:url(images/layout/aktueel_bg.gif);
background-repeat: repeat-y;
}

Can someone tell me whats wrong with this code because there is no shadow

Please help

Musicscore

Posted: **Thu Aug 02, 2007 7:40 pm**

This line:

filter:shadow(color=#333333, direction=135);

will only work with IE.

You need to do something like this to achieve a cross-browser shadow.

Code: Select all

<div class="infowrapper" style="position: relative; width: 120px; top:-90px; left: 40px;">
  <div class="shadowbox" style="position: absolute; left: 10px; top: 10px;
    width: 120px; height: 84px; background-color: black;
    filter: alpha(opacity=30); -moz-opacity: 0.3; opacity: 0.3;"> </div>
  <div class="infobox" style="position: relative; height: 80px;
    background-color: #FFFFDD;"> I am flying above the text and dropping a shadow.</div>
</div>

Nullig

Posted: **Thu Aug 02, 2007 7:46 pm**

Have you seen this...

http://multiintech.com/

no images...

Posted: **Thu Aug 02, 2007 8:13 pm**

@mark

The left-hand side of the shadow at the bottom and the right-hand side at the top aren't indented, as a shadow would be.

Nullig

CMS Made Simple Forums

Add Shadow to CSS Block

Add Shadow to CSS Block

Re: Add Shadow to CSS Block

Re: Add Shadow to CSS Block

Re: Add Shadow to CSS Block