meine navi leiste klebt aneinander also alle kästen.
wie kann ich es auseinander ziehen?
<html>
<head>
<title>X</title>
<link rel="stylesheet" type="text/css" href="style.css" media="all"/>
</head>
<body bgcolor=#d9d9d9>
<style>
.container {
clear: both;
float: left;
width: 100%;
overflow: hidden;
background: ##56585b;
font-family: Verdana;
font-size: 1em;
}
#navi {
float: left;
position: center;
left: 50%;
margin: 2 auto;
padding: 40;
list-style-type: none;
}
#navi li {
float: left;
position: center;
right: 50%;
}
#navi a {
width: auto;
display: block;
padding: 5px;
line-height: 1.5em;
color: #000000;
background: ##56585b;
border:2px solid #024c68;
text-decoration:none;
}
#navi a:hover {
background: #56585b;
color: #000;
}
{bcolor: grey}
div.a {
text-align: center;
}
ul.horizontal li{
display:block;
float:center;
padding:0 10px;
}
</style>
<div class="a">
<u><h1>XXXXXXXXXXXXXXXXXX</h1></u>
</div>
<p>XXXXXXXXXXXXXXXXXXXXXXXXX
<div class="container">
<ul id="navi">
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
<li><a href="#">Link 5</a></li>
<li><a href="#">Link 6</a></li>
<li><a href="#">Link 7</a></li>
</ul>
</div>
</body>
</html>
