Вложенный список криво отображается

[AndreyT]

вот сделал двухуровневое меню

HTML:

<ul id="nav">
	<li><a href="#">Главная</a></li>
	<li><a href="#">Уроки</a>
		<ul>
			<li><a href="#">HTML</a></li>
			<li><a href="#">CSS</a></li>
			<li><a href="#">javascript</a></li>
			 <li><a href="#">MySQL</a></li>
			<li><a href="#">PHP</a></li>
		</ul>
	</li>
	<li><a href="#">Статьи</a></li>
	<li><a href="#">Учебники</a></li>
	<li><a href="#">Контакты</a></li>
</ul>

CSS:

#nav {
	list-style:none;
	margin:20px;
	padding:0;
	background:url(back_li_green.gif) repeat-x;
	font:14px/40px Verdana, Arial, Helvetica, sans-serif; 
	height:40px;
	width:605px;
	border:1px solid #000;
}

#nav li {
	float:left; 
	position:relative;
}
#nav li:hover, #nav li.jshover {
	background-image:url(back_li_red.gif);
}

#nav a {
	display:block;
	color:#3A3A3A;
	width:120px;
	text-align:center;
	text-decoration:none;
	border-right:1px solid #000;
}
#nav a:hover {
	background-image:url(back_li_red.gif);
	color:#F5F5F5;
}

#nav ul {
	list-style:none;
	border:1px solid #000; 
	border-top:0;
	border-bottom:0;
	display:none;
	width:120px;
	position:absolute;
	top:41px; 
	left:0;
}

#nav ul a {
	border:0; 
	border-bottom:1px solid #000; 
	width:120px;
	background:url(back_li_green.gif) repeat-x;
}

#nav li:hover ul, #nav li.jshover ul {
	display:block;
}

при наведении на пункт меню первого уровня меню второго уровня показывается не так как нужно, слева пустое пространство

какое свойство нужно изменить или добавить, чтоб это пространство убрать?

[psywalker]

Пока не ясно, дай ссылку на пример отдельный.

[AndreyT]

Пока не ясно, дай ссылку на пример отдельный.

http://winner07.ho.ua/menu.html

[psywalker]

У вложенного списка обнули паддинги.

[AndreyT]

У вложенного списка обнули паддинги.

Спасибо все работает

[psywalker]

Спасибо все работает

Ещё бы