Centrer un float dans un div

Bonjour, je suis un peu désespéré, et jappel donc à votre aide .

Ma question peut paraitre idiote, mais je galère depuis un petit moment, et je n'arrive pas à trouver une solution...

Mon but est de créer un menu horizontal en apliquant la propriété Float et de centrer celui-ci dans un "cadre général", de plus, lui apliquer un background sur toute la largeur du cadre.

voici mon code actuel:


[HTML] :

<div id="cadre">
	<ul id="menu">
		<li><a href="#">Lien 1</a></li>
		<li><a href="#">Lien 2</a></li>
		<li><a href="#">Lien 3</a></li>
		<li><a href="#">Lien 4</a></li>
	</ul>
</div>

et ma [CSS] :

#cadre {
position : absolute;
background : url('images/fond.png');
width : 600px;
height : 400px;
left : 50%;
margin-left : -300px;
}

#menu ul {
position : absolute;
background : url('images/fond_menu.png');
list-style-type : none;
top : 100px;
margin : 0;
}

#menu li {
float : left;               /* transforme le menu en horizontale */
}

#menu a {
display : block;
margin : 0 10px;     /* aplique une marge entre chaque block */
}

#menu a:hover {
color : white;
}

A partir de la, comme margin : 0 , je ne sais plus du tout ce qu'il faut que je face. si je donne une valeur width à UL d'a peu pres la largeur exact de l'ensemble des liens, pour y faire ensuite un left : 50% et un margin-left : -xxpx, cela met en cause le margin : 0. Et ca remet l'incrémentation de UL

Que faire ?

Modifié par Erad (01 Nov 2005 - 08:25)

En vous remerciant de vos réponses.
Modifié par Erad (01 Nov 2005 - 08:25)