CSS menu

[aNt1]

Вот, есть CSS выпадающее меню

}
#nav li ul {
  display: none;
}
#nav a {
	text-transform:uppercase;
	font-size:14px;
	text-align:center;
		background-image:url(/imgA/mn.gif);
  color: #fff;
  text-decoration: none;
  display: block;
  width: 102px;
  padding:10px;
	background: #515151;
}
#nav a:hover {
  color: #000;
  background: #ccc;
}
#nav li:hover {
  background: #515151;
}
#nav li ul {
  display: none;
}
#nav li ul {
  display: none;
  position: absolute;
  background: url(fone-tr.png);
  padding: 8px 0;
  width: 200px;
}
#nav li li a {
  width: 300px;
  background: none;
}
#nav li:hover ul {
  display: block;
  padding:0;
}
#nav li:hover li ul {
  display: none;
  width: 138px;
  top: -9px;
  left: 300px;
}
#nav li:hover li:hover ul {
  display: block;
}

Хелпаните кто-нить, подскажите как сделать чтобы выпадающие блоки были шириной 300 с отступом чтобы друг друга не перекрывать и выпадающие блоки были поверх блоков сайта.

Заранее спасиб.