Dropshadow

Editor: Håkan Petersson

Having a dropshadow without an image sounds too good to be true, don't you agree?

Example

Well, it is possible with css. Let me show you how.

  1. Open up your CSS inspector and choose class. Give it a name (I use .dropshadow)
  2. Then choose the last little icon named "List and Others"
  3. In the property-name type in "filter".
  4. Copy and paste the following code in the property-value: progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray', Positive='true')
  5. As you see there are 4 places to change values. I have made them blue.
  6. The OffX and OffY value is how many pixels the dropshadow will have.
  7. The Color is the color nr or in this case, the colorname.
  8. The Positive value is "true" or "false".


To use is open the CSS window chose eg the table tag and apply it. This work on Table, TD, DIV and a lot more.

Enjoy and have fun.