Víceúrovňové menu

Ahoj, mám menčí problém s poskládáním více úrovňového menu. Totiž když mám první úroveň , tak je vše v pohodě, odkazy jsou normálně pod sebou(odkaz1 odkaz2 ...). Když pak dám pododkaz 1 , nastavim mu marginy že se zobrazí vedle odkazu 1. Jakmile ale přidám ještě pododpaz2 hned pod jedničku, tak se mi udělá mezera mezi odkazem 1 a 2.. a nevím ja kse toho zbavit.
Jenom tak si hraju, časem by to mělo fungovat tak, že když najedu na odkaz 1, vedle hlavního menu se mi oběví "podmenu" . Díky za pomoc :)

CSS:
ul
{
margin: 0;
margin-top: 10px;
padding: 0;
width: 100%;
/*border-top: 5px solid #FF8383;
border-bottom: 5px solid #FF8383;*/
}

ul li
{
font-weight: normal;
/*color: grey;
font-size: 18px;*/
/*border: 5px solid #FF8D8D;*/
list-style: none;
margin: 0px;
}

ul li a
{
display: block;
width: 100%;
padding: 5px 0px 5px 0px;
margin: 0px;
background-color: #FFD5D5;
color: #808080;
font-size: 18px;
text-decoration: none;
}

ul li a:hover
{
background-color: #FF8D8D;
color: white;
}

ul li ul
{
position: relative;
background-color: #FFD5D5;
margin-left: 170px;
margin-top: -31px;
/*visibility: hidden;*/
border-left: 1px solid grey;
overflow: visible;
}
ul li ul li
{
padding: 5px 0px 5px 0px;
}

tak už jsem to vyřešil sám. position jsem dal absolute a velikost ne 100% ale 170px takže se mi to neroztahovalo přes všechny divy na stránce. Tak dík alespoň za to přečtení :)