Supersized JQuery plugin displaying below content on IE9

Question

I am using the Supersize plugin and it works fine on Chrome, FF and Safari but (suprise, surprise) not on IE9 (and 8 and 7).

The background images are appearing below my content, not behind it.

I think this should be a css fix as the Supersized images sit below all other content in a ul with the styles:

display: block;
position: fixed;
left: 0;
top: 0;
overflow: hidden;
z-index: -999;
height: 100%;
width: 100%;

Would anyone know how to correct this?

Answer 1

OK - it seems the CMS I was using (ModX Revo) came preloaded with the wrong (or no) DOCTYPE.

I've added

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

To my templates (above the <html> ) tag and it seems ok!