Menu horizontaux s'affichent a la verticale sur IE

Bonjour,

je me suis récemment remis a coder en html/css et a mettre a jour mes connaissances pour dépanner un ami qui veut que je change le visuel de son site ( www.tetragones.com) et je rencontre actuellement un problème de compatibilité avec IE.

Sur FF, chrome et safari mes menus s'affichent à l'horizontal comme je le veux et sans puces, mais sous IE ils reviennent à la verticale et les puces s'affichent.

voici l'adresse de la page d'accueil provisoire qui pose problème ,http://s527121878.onlinehome.fr/

ça fait plusieurs heures que je m'arrache les cheveux dessus et ça sera vraiment super d'avoir une solution.

Merci d'avance pour toutes vos réponses.

Code HTML
<nav id="navsoc" >
<ul>
<li><a class="lien1" href="#"><img src="images/boutonrss.png"></a></li>
<li><a class="lien1" href="#"><img src="images/boutontwit.png"></a></li>
<li><a class="lien1" href="#"><img src="images/boutonfcb.png"></a></li>
</ul>
</nav>

<div id="header">

<img src="images/logo.png" id="logo"/>

</div>

<nav id="nav" >
<ul >
<li><a class="lien1" href="#"><img src="images/contactlien.png"></a></li>
<li><div class="trait"><img src="images/traitmenu1.png"></div></li>
<li><a class="lien1" href="#"><img src="images/Webdesign.png"></a></li>
<li><div class="trait"><img src="images/traitmenu1.png"></div></li>
<li><a class="lien1" href="#"><img src="images/lagence.png"></a></li>
</ul>
</nav>

Code CSS

#logo {float: left;margin-bottom:50px;}
#nav {padding: 0;float:right;}
#nav li { list-style:none;float:right;display:inline;}

#navsoc {padding: 0;float:right; margin-right:50px;}
#navsoc li {list-style:none;float:right;margin:10px;display:inline;list-style-image: none;}