Собственно есть меню на ксси мне надо сделать подменю разной ширины

вот код

ul.ldd_menu {
	margin: 0px;
	padding: 0;
	display: block;
	height: 50px;
	background-color: #0051A1;
	list-style: none;
	font-family: "Trebuchet MS", sans-serif;
	border-top: 1px solid #3474C6;
	border-bottom: 1px solid #3474C6;
	border-left: 10px solid #0051A1;
	-moz-box-shadow: 0px 3px 4px #007BC2;
	-webkit-box-shadow: 0px 3px 4px #007BC2;
	-box-shadow: 0px 3px 4px #007BC2;
	}
ul.ldd_menu a {
	text-decoration: none;
	}
ul.ldd_menu > li {
	float:left;
	position:relative;
	}
ul.ldd_menu > li > span {
	float: left;
	color: #fff;
	background-color: #0051A1;
	height: 50px;
	line-height: 50px;
	cursor: default;
	padding: 0px 20px;
	text-shadow: 0px 0px 1px #fff;
	border-right: 1px solid #3474C6;
	border-left: 1px solid #0049A1;
	}
ul.ldd_menu .ldd_submenu {
	position: absolute;
z-index: 2;
	top: 50px;
	width: 180px;
	display: none;
	opacity: 0.9;
	left: 0px;
	font-size: 10px;
	background: #0051A1;
	border-top: 1px solid #3474C6;
	-moz-box-shadow: 0px 3px 4px #0051A1 inset;
	-webkit-box-shadow: 0px 3px 4px #0051A1 inset;
	-box-shadow: 0px 3px 4px #0051A1 inset;
	}


ul.ldd_menu .ldd_submenu2 {
	position: absolute;
z-index: 2;
	top: 50px;
	width: 480px;
	display: none;
	opacity: 0.9;
	left: 0px;
	font-size: 10px;
	background: #0051A1;
	border-top: 1px solid #3474C6;
	-moz-box-shadow: 0px 3px 4px #0051A1 inset;
	-webkit-box-shadow: 0px 3px 4px #0051A1 inset;
	-box-shadow: 0px 3px 4px #0051A1 inset;
	}

a.ldd_subfoot{
	background-color: #f0f0f0;
	color: #444;
	display: block;
	clear: both;
	padding: 15px 20px;
	text-transform: uppercase;
	font-family: Arial, serif;
	font-size: 12px;
	text-shadow: 0px 0px 1px #fff;
	-moz-box-shadow: 0px 0px 2px #777 inset;
	-webkit-box-shadow: 0px 0px 2px #777 inset;
	-box-shadow: 0px 0px 2px #777 inset;
	}
ul.ldd_menu ul {
	list-style: none;
	float: left;
	border-left: 1px solid #2A6DC3;
	margin: 20px 0px 10px 30px;
	padding: 10px;
	}
li.ldd_heading {
	font-family: Georgia, serif;
	font-size: 13px;
	font-style: italic;
	color: #69C3FF;
	text-shadow: 0px 0px 1px #B03E23;
	padding: 0px 0px 10px 0px;
	}
ul.ldd_menu ul li a {
	font-family: Arial, serif;
	font-size: 10px;
	line-height: 20px;
	color: #fff;
	padding: 1px 3px;
	}
ul.ldd_menu ul li a:hover {
	-moz-box-shadow: 0px 0px 2px #2A6DC3;
	-webkit-box-shadow: 0px 0px 2px #2A6DC3;
	box-shadow: 0px 0px 2px #2A6DC3;
	background: #007BC2;
	}

а вот меню

<ul id="ldd_menu" class="ldd_menu">
	<li>
		<span>Благоустройство дачи</span>
		<div class="ldd_submenu">
			<ul>
				<li><a href="#">Дача своими руками</a></li>
				<li><a href="#">Вода, Водопровод и водоочистка</a></li>
				<li><a href="#">Постройки</a></li>
				<li><a href="#">Печи, Камины</a></li>
				<li><a href="#">Инструменты</a></li>
<li><a href="#">Советы дачникам</a></li>
			</ul>
			
			<a class="ldd_subfoot" href="#"></a>
		</div>
	</li>
	<li>
		<span>Сад и огород</span>
		<div class="ldd_submenu2">
			<ul>
				<li class="ldd_heading">Фрукты и ягоды</li>
				<li><a href="#">Клубника</a></li>
				<li><a href="#">Крыжовник</a></li>
				<li><a href="#">Малина</a></li>
				<li><a href="#">Смородина</a></li>
			</ul>
			<ul>
				<li class="ldd_heading">Овощи</li>
				<li><a href="#">Кабачки</a></li>
				<li><a href="#">Перец</a></li>
				<li><a href="#">Огурцы</a></li>
				<li><a href="#">Морковь</a></li>
				<li><a href="#">Картофель</a></li>
				<li><a href="#">Зелень и травы</a></li>
			</ul>
			<ul>
				<li class="ldd_heading">Деревья и кустарники</li>
				<li><a href="#">Яблоня</a></li>
				<li><a href="#">Малина</a></li>
				<li><a href="#">Крыжовник</a></li>
			</ul>
			<ul>
				<li class="ldd_heading">Цветы на даче</li>
				<li><a href="#">Нарцисс</a></li>
				<li><a href="#">Гибискус</a></li>
				<li><a href="#">Флоксы</a></li>
				<li><a href="#">Лилейники</a></li>
				<li><a href="#">Петунии</a></li>
			</ul>
<ul>
				<li class="ldd_heading">Комнатные растения</li>
				<li><a href="#">Нарцисс</a></li>
				<li><a href="#">Гибискус</a></li>
				<li><a href="#">Флоксы</a></li>
				<li><a href="#">Лилейники</a></li>
				<li><a href="#">Петунии</a></li>
			</ul>
<ul>
				<li class="ldd_heading">Делимся опытом</li>
			
			</ul>
<ul>
				<li class="ldd_heading">Болезни и вредители</li>
				
			</ul>
			<a class="ldd_subfoot" href="#"> + Еще ссылка</a>
		</div>
	</li>
	<li>
		<span>Меню №3</span>
		<div class="ldd_submenu">
			<ul>
				<li class="ldd_heading">Заголовок №1</li>
				<li><a href="#">Ссылка №1</a></li>
				<li><a href="#">Ссылка №2</a></li>
				<li><a href="#">Ссылка №3</a></li>
				<li><a href="#">Ссылка №4</a></li>
				<li><a href="#">Ссылка №5</a></li>
			</ul>
			<ul>
				<li class="ldd_heading">Заголовок №2</li>
				<li><a href="#">Ссылка №1</a></li>
				<li><a href="#">Ссылка №2</a></li>
				<li><a href="#">Ссылка №3</a></li>
				<li><a href="#">Ссылка №4</a></li>
				<li><a href="#">Ссылка №5</a></li>
			</ul>
			<ul>
				<li class="ldd_heading">Заголовок №3</li>
				<li><a href="#">Ссылка №1</a></li>
				<li><a href="#">Ссылка №2</a></li>
				<li><a href="#">Ссылка №3</a></li>
				<li><a href="#">Ссылка №4</a></li>
				<li><a href="#">Ссылка №5</a></li>
			</ul>
			<a class="ldd_subfoot" href="#"> + Еще ссылка</a>
		</div>
	</li>
</ul>

собственно если поставить ldd_submenu2 то подменю вообще невыскакивает