IE9 Rending box shadow incorrectly

[nightstick]

I'm piecing together a draft of a site and it looks OK (for now) in most browsers. The main issue I'm dealing with at the moment is how IE9 is rendering SOME of the box shadows.

I'm on a mac and don't have IE9 so I've just been relying on screen shots.

Here's the site.

I'm using the same box shadow on all elements:

element {
	-webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .3);
	-moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .3);
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .3);
}

I've tried using a grey color with no 1 opacity - same issue. I've also tried with hex instead of rgb.

It seems to be working for the small images in the sidebar, but the shadows everywhere else are disastrous.

Can anyone spot what I'm missing here?

 

[nightstick]

Solved (sort of)

So I have apparently resolved this issue although I do not understand why this worked. While working on something unrelated, I added relative positioning to one of the elements whose shadow was not displaying correctly. Now it works... All I had to do was add

position: relative

to everything that contains a box-shadow.

I don't understand it, but it's fixed.

 

[Nathan Joshua]

I'm sure in IE10 it will be fixed.

For now, remember that IE is a pain to work with. I've had to scrap many hours of coding because of it.