CSS: Easy to do?

[Goksly]

I'm messing around with a personal site and when I apply a css class to a div I want it to look like this:

Now I know I could fix the size of the divs and have numerous background images to fit that, but it seems a bit 'wrong'. Is there a way to do it with CSS?

I was thinking maybe have the drop shadow as a back ground image, the filtering done via CSS (as seen here: http://css3please.com/), but not sure how I'd do the top section and bottom section (i.e. no drop shadow on the top, drop shadow all along the bottom).

Thanks in advance!

 

[Goksly]

Defo needs to work in IE 7 and 8

 

[Goksly]

Thanks guys (and thanks for even slicing the image up - appreciated!)

Was hoping there was some way around having to create extra divs, but it's not a massive deal and gives the required effect.

Thanks.