Thursday, August 11, 2005

DSF - Robust CSS Drop Shadows

Drop shadows are cool, but adding them to elements of a web page can be a pain. You can fiddle with background images, tables, pure CSS solutions, Internet Explorer PNG limitations, or fixed single-use shadows tied to an image and a particular background.

The latest release of TypePad has a new popup (or flyout) interface element which presents the user with a set of options or an expanded view of an object when clicked on. The flyouts are similar to the location bubbles used in Google Maps. They have soft alpha-blended drop shadows that scale with the size of the box. The drop shadows are implemented in valid XHTML and CSS, with no CSS hacks or JavaScript. We call it ydnar Drop-Shadow-Fu.

Article is courtesy of Randy 'ydnar' Redding