You have a beautiful, syntactically valid piece of html that SHOULD be aligned center in all browsers, and is aligned center in FireFox and Chrome, but refuses to align center in IE 9.
I encountered this when I built the WordPress theme for this very blog. The cause of alignment problems in IE 9 is that IE 9 wants to render the page in “Quirks” mode, even if the doctype is valid. I’m sure there is a reason, but the solution is so simple, who really cares?
Just add the following bit of code into the system
<meta http-equiv=”X-UA-Compatible” content=”IE=9″ >
And quirks mode is gone! The alignment problems in IE 9 are gone! It will now render properly in a modern format.