box-shadow

box-shadow allows you to create drop shadows in CSS.

This is the code I use:

p.test {
	border: 1px solid black;
	padding: 10px;
	box-shadow: -10px -10px 8px grey;
}

Note the syntax:

  1. Horizontal offset
  2. Vertical offset
  3. Blur
  4. Colour

I add the four vendor prefixes in the later tests.

Tests

This test element uses pure box-shadow.

This test element uses -webkit-box-shadow.

This test element uses -moz-box-shadow.

This test element uses -o-box-shadow.

This test element uses -ms-box-shadow.