Къде е проблема?

[dashe]

CSS:

div#lenta {
	background: url(../img/lenta.gif);
	width: 100%;
	height: 5px;
}

div.navigation {
	width: 800px;
	margin: 0 auto;
	padding: 0;
}

div.navigation ul {
	margin: 0x;
	padding: 0px;
	list-style-type: none;
}

div.navigation li {
	display: inline;
	margin: 0px;
	padding: 0px;
}

div.navigation a {
	background: url(../img/navigation.png) no-repeat;
	text-decoration: none;
	width: 102px;
	height: 35px;
}

HTML:

	<div id="lenta">
		<div class="navigation">
			<ul>
			<li><a href="#">Начало</a></li>
			<li><a href="#">Начало</a></li>
			<li><a href="#">Начало</a></li>
			<li><a href="#">Начало</a></li>
			</ul>
		</div>
	</div>

Така.
Обаче от menu-то на a-то не ми излиза цялото изображение?
Къде е проблема :roll:
btw:
Бях забравил да затворя </li>-тата обаче не е от там проблема.. :lol:

 

[hpstuff]

div.navigation a {
display: block;
background: url(../img/navigation.png) no-repeat;
text-decoration: none;
width: 102px;
height: 35px;
}

 

[dashe]

Идеално.
Благодаря
Та сега одарих на друг камък.
Излизат едно под друго смисъл сега излизат вертикално а на мен ми трябва хоризонтално

 

[hpstuff]

div.navigation ul {
overflow: hidden; //зада изчисти float-a
margin: 0x;
padding: 0px;
list-style-type: none;
}

div.navigation li {
float: left;
display: inline; // премахни тоя ред
margin: 0px;
padding: 0px;
}

 

[marian]

div.navigation li {
display: inline;
margin: 0px;
padding: 0px;
float:left;
}

 

[dashe]

@hpstuff Благодаря