I must apologize for horribly neglecting my blog, but I have been incredibly busy with new projects. So, as a remedy I figured I would blog occasionally about things that I use while I am either coding or designing that I think some people might find helpful. They might fall in the category of CSS, design methods, useful websites, software suggestions or what I think to be helpful tidbits.

The first bit of helpful advice will be a CSS tip, full CSS box drop shadows. This is a fairly well-known technique for creating drop shadows that are very simple and easily controlled fully through CSS.

To add a drop shadow to an element simply use the below code including the bits to make sure you are Mozilla (Firefox) & Webkit (Safari/Chrome/Konqueror) safe:

---

-webkit-box-shadow:3px 3px 9px #ccc; -moz-box-shadow:3px 3px 9px #ccc; box-shadow:3px 3px 9px #ccc;

---

Here is an example of what this does:

Box drop shadow!

---

To control each element just change the values as follows .box { box-shadow: <horizontal offset>, <vertical offset>, <blur>, <color>;}

I hope this helps and possibly saves you some time from the old image based method of creating shadows.

Enjoy!