Styling IE9 issue

Well hello there,

I have this slight issue. I had it all working and displaying correctly. I have run into this issue. I have a navigation and slideshow which are both on an angle as well as floating left and z-index in a way to display properly. It displays properly everywhere. Other computers, and such, except IE9. Although I've noticed this issue is with larger screens I belevie. The issue is that some things dont float left anymore and are not angled. Here is the website and code:
http://www.wartachicago.org/wptest/

HTML

HTML Code:

---

<!-- NAVIGATION AND SLIDESHOW DIV AND LINK BACK -->
        <div id="header">
                <a href="index.php"><img id="wartal" alt="WARTA_LOGO" src="http://www.wartachicago.org/wptest/wp-content/themes/Warta/images/warta.png"/></a>
                        <div id="pos1">
                                <div id="show">
                                </div>
                        </div>
                               
                                <div id="pos2">
                                <ul id="nav">
                                <li><a class="nav" href="index.php">Gł&#243;wna Strona</a></li>
                                <li><a class="nav" href="###">Kalendarz</a></li>
                                <li><a class="nav" href="###">Zdjęcia</a></li>
                                <li><a class="nav" href="###">Wiadomści</a></li>
                                <li><a class="nav" href="###">Informacjia o Hufcu</a></li>
                                <li><a class="nav" href="###">Jednostki</a></li>
                                <li><a class="nav" href="###">Sklepik</a></li>
                                <li><a class="nav" href="###">Kontakt</a></li>
                                </ul>
                                </div>
        </div>

---

CSS

HTML Code:

---

#header {
        background-image: url("http://www.wartachicago.org/wptest/wp-content/themes/Warta/images/header.jpg");
        background-repeat:no-repeat;
        width:955px;
        height:426px;
}

#wartal {
        float:left;
        padding-top:90px;
        padding-left:98px;
}

#pos1 {
        float:left;
        padding-top:110px;
        padding-left:115px;
        transform: rotate(5.39deg);
        -ms-transform: rotate(5.39deg); /* IE 9 */
        -webkit-transform: rotate(5.39deg); /* Safari and Chrome */
        -o-transform: rotate(5.39deg); /* Opera */
        -moz-transform: rotate(5.39deg); /* Firefox */
}

#pos2 {
        position:absolute;
        z-index:1;
        float:left;
        padding-top: 175px;
        padding-left:70px;
        transform: rotate(-4.10deg);
        -ms-transform: rotate(-4.10deg); /* IE 9 */
        -webkit-transform: rotate(-4.10deg); /* Safari and Chrome */
        -o-transform: rotate(-4.10deg); /* Opera */
        -moz-transform: rotate(-4.10deg); /* Firefox */
}

ul#nav  {
        list-style-type: none;
        font: 15px Tahoma, Sans-serif;
        color:black;
}

li {
        list-style-type: none;
        padding-top:8px;
}

 a:link {font: 15px Tahoma, Sans-serif; color:black; text-decoration:none;} /*unvisited link*/
 a:visited {font: 15px Tahoma, Sans-serif; color:black; text-decoration:none;} /*visited link*/
 a:hover {font: 15px Tahoma, Sans-serif; color:black; text-decoration:underline;} /*mouse over link*/
 a:active{font: 15px Tahoma, Sans-serif; color:black; text-decoration:underline;} /*selected link*/

---

I've copy and pasted the most important bits of code for you to see. If anyone can help me out here that would be fantastic....

Any chance your version of IE is forced into compatibility mode? The site looks fine to me on IE and Firefox, when they're in standards mode.

Dave

:eek: How did I not notice that! Hahahah silly me, thanks!