Problema com IE

Bem estou desenvolvendo um site, e o FDM do Internet Explorer(porque isso ainda existe?) não gosto pelo jeito, bem, fiz o topo com menu, o topo é um div (#topo), dentro dele tenho a div (#menu) e uma imagem de logo, o problema é que o menu deve ficar a direita e a imagem no centro, no Safari e Firefox tranquilo, no IE o menu fica acima da img, bem, segue o código:

<div id="topo">

 <div id="menu">

 <ul>

 <li id="m_home"><a href="index.php"></a></li>
 <li id="m_empresa"><a href="#"></a></li>
 <li id="m_produtos"><a href="#"></a></li>
 <li id="m_contato"><a href="#"></a></li>

 </ul>

 </div>
 <!-- //MENU -->

 <img id="logo" src="img/logo.png" alt="Logo" />

	</div>

CSS:

*{

	margin: 0;
	padding: 0;
	list-style: none;
	text-decoration: none;
}

/** BODY **/

body{

	font: "Trebuchet MS", Verdana, Calibri, Tahoma;
}

/*********************************************/
/ TOPO /
/*********************************************/

#topo{
	background: url(../img/bg_topo.png) no-repeat left;
	border-top: 5px solid #9b0b23;
	border-bottom: 1px solid #9b0b23;
	width: 100%;
	height: 129px;
	display: block;
	text-align: center;
}

/*********************************************/
/ MENU /
/*********************************************/

#menu{
	float: left;
	margin: 4px 0 0 5px;
	text-align: left;
}

/** BOTOES **/

#m_home a{

	display: block;
	width: 82px;
	height: 28px;
	margin: auto auto 2px auto;
	background: url(../img/btn_menu_n.png) no-repeat;
}

#m_empresa a{

	display: block;
	width: 82px;
	height: 28px;
	margin: auto auto 2px auto;
	background: url(../img/btn_menu_n.png) 0 -30px no-repeat;
}

#m_produtos a{

	display: block;
	width: 82px;
	height: 28px;
	margin: auto auto 2px auto;
	background: url(../img/btn_menu_n.png) 0 -60px no-repeat;
}

#m_contato a{

	display: block;
	width: 82px;
	height: 28px;
	margin: auto auto 2px auto;
	background: url(../img/btn_menu_n.png) 0 -90px no-repeat;

}~

Alguem viu um erro, ou modo de consertar?

Qualquer ajuda ja me ajuda(obvio).

Obrigado!