Website/Homepage: Horizontale Buttons zentrieren?

Bowser Jr. · 17.01.2012, 14:15

Hey,
ich habe überall im Internet gesucht und auch viel gefunden, aber leider konnte mir nichts helfen.
Ich versuche 6 Buttons nebeneinander ohne Abstand zu zentrieren.

Hier mein Quelltext:
<head>
<title>HorizontaleButtonLeiste</title>
<style>
Navi1 { display:block;
background-image:url(Button1Normal.png);
width:160px; height:40px }
Navi1:hover { background-image:url(Button1MouseOver.png); }
</style><style>
Navi2 { display:block;
background-image:url(Button2Normal.png);
width:160px; height:40px }
Navi2:hover { background-image:url(Button2MouseOver.png); }
</style>
<style>
Navi3 { display:block;
background-image:url(Button3Normal.png);
width:160px; height:40px }
Navi3:hover { background-image:url(Button3MouseOver.png); }
</style><style>
Navi4 { display:block;
background-image:url(Button4Normal.png);
width:160px; height:40px }
Navi4:hover { background-image:url(Button4MouseOver.png); }
</style>
<style>
Navi5 { display:block;
background-image:url(Button5Normal.png);
width:160px; height:40px }
Navi5:hover { background-image:url(Button5MouseOver.png); }
</style> <style>
Navi6 { display:block;
background-image:url(Button6Normal.png);
width:160px; height:40px }
Navi6:hover { background-image:url(Button6MouseOver.png); }
</style>
<style>#navi li
{
float: left;
margin-left: 0px;
display:inline;
}</style><style>#navi ul
{
margin: o auto;
padding: 0;
list-style-type: none;
}</style>
</head>
<body>
<div id="navi"><ul><li><navi1 href="#"></navi1></li></a><li><navi2 href="#"></navi2></li><li><navi3 href="#"></navi3></li><li><navi4 href="#"></navi4></li><a href="#" target="_top"><li><navi5 href="#"></navi5></li></a><li><navi6 href="#"></navi6></li></ul></div>
<p> </p>
</body>

Kann meinen Fehler einfach nicht finden, vielleicht könnt ihr es? Wäre Klasse!
Vielen Dank im Voraus!