PAssar Um Menu Css Horizontal para Vertical

[frkjr007]

Por favor me ajudem

O Código Do Meu Menu é :

<script type="text/javascript"></script><style>

#navigation{

background: url(http://img258.imageshack.us/img258/3227/barrayk2.png) repeat-x;

}

#navigation li{

position: relative;

list-style: none;

}

.nav-container .item-secondary-title{

display:block;

cursor:default;

white-space:nowrap;

}

.clear{

font-size:1px;

height:0px;

width:0px;

clear:left;

line-height:0px;

display:block;

float:none;

}

.nav-container{

position:relative;

zoom:1;

margin: 0 auto;

}

.nav-container a, .nav-container li{

float:left;

display:block;

white-space:nowrap;

}

.nav-container div a, .nav-container ul a, .nav-container ul li{

float:none;

}

.nav-container ul{

left:-10000px;

position:absolute;

}

.nav-container, .nav-container ul{

list-style:none;

padding:0px;

margin:0px;

}

.nav-container li a{

float:none

}

.nav-container li{

position:relative;

}

.nav-container ul{

z-index:10;

}

.nav-container ul ul{

z-index:20;

}

.nav-container ul ul ul{

z-index:30;

}

.nav-container ul ul ul ul{

z-index:40;

}

.nav-container ul ul ul ul ul{

z-index:50;

}

li:hover>ul{

left:auto;

}

#nav-container ul {

top:100%;

}

#nav-container ul li:hover>ul{

top:0px;

left:100%;

}

/*^'^ Primary Items ^'^*/

#nav-container a{

height: 18px;

width: 50;

padding:6px 17px 6px 17px;

margin: 0px 0px 0px 0px;

color: #ffffff;

font-family: Trebuchet MS, Arial, sans-serif, Helvetica;

font-size:14px;

text-align: center;

text-decoration:none;

font-weight: bold;

background: url(http://img258.imageshack.us/img258/3227/barrayk2.png);

background-repeat: repeat;

background-position: top;

}

#nav-container a:hover{

color: #0000FF;

background-repeat: repeat;

background-position: center;

}

/*^'^ Secondary Items Container ^'^*/

#nav-container div, #nav-container ul{

padding:0px 0px 0px 0px;

margin:0px 0px 0px 0px;

background-repeat: repeat-x;

background-color: #3D81EE;

border-bottom: 1px solid #ffffff;

}

/*^'^ Secondary Items ^'^*/

#nav-container div a, #nav-container ul a{

padding:2px 2px 2px 2px;

background-color: #3D81EE;

background-repeat: no-repeat;

background-position: 0px 25px;

font-size:11px;

border-width:2px;

border-color: #225588;

border-style:solid;

margin: 0px 0px 0px 0px;

width: 145px;

}

/*^'^ Secondary Items Hover State ^'^*/

#nav-container div a:hover, #nav-container ul a:hover{

background: url(http://img174.imageshack.us/img174/8585/ahoverbf6.png);

background-repeat: no-repeat;

color:#ffffff;

}

/*^'^ Secondary Item Titles ^'^*/

#nav-container .item-secondary-title{

cursor:default;

padding:4px 0px 3px 7px;

color: #004300;

font-family: Arial, Trebuchet MS, Arial, sans-serif, Helvetica;

font-size:11px;

/* background: url(http://img91.imageshack.us/img91/4831/barrael6.png); */

background-repeat: no-repeat;

font-weight:bold;

}

/*^'^ Horizontal Dividers ^'^*/

#nav-container .divider-horiz{

border-top-width:3px;

border-color: #CBF69D;

}

/*^'^ Vertical Dividers ^'^*/

#nav-container .divider-vert{

border-left-width:1px;

height:15px;

margin:4px 2px 0px 2px;

border-color:#CBF69D;

}

</style>

<ul id="nav-container" class="nav-container">

<li><a class="item-primary" href="http://fastfilmes.blogspot.com/">Home</a>

</li>

<li><a class="item-primary" href="http://fastfilmes.blogspot.com/search/label/Filmes">Filmes </a>

<ul style="width:150px;">

<li><a href="http://fastfilmes.blogspot.com/search/label/A%C3%A7%C3%A3o">Ação</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Anima%C3%A7%C3%A3o">Animação</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Aventura">Aventura</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Com%C3%A9dia">Comédia</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Com%C3%A9dia%20Rom%C3%A2ntica">Comédia Romântica</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Document%C3%A1rio">Documentário</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Drama">Drama</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Faroeste">Faroeste</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Fic%C3%A7%C3%A3o%20Cient%C3%ADfica">Ficção Científica</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Guerra">Guerra</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Musical">Musical</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Policial">Policial</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Romance">Romance</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Show">Show</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Suspense">Suspense</a></li>

<li><a href="http://fastfilmes.blogspot.com/search/label/Terror">Terror</a></li>

</ul></li>

<li><a class="item-primary" href="http://fastfilmes.blogspot.com/search/label/Séries">Séries</a>

<ul style="width:150px;">

<li><a href="http://fastfilmes.blogspot.com/search/label/Big%20Bang">The Big Bang Theory</a></li>

</ul></li>

<li><a class="item-primary" href="http://fastfilmes.blogspot.com/search/label/Qualidades">Qualidade</a></li>

<li><a class="item-primary" href="http://fastfilmes.blogspot.com/search/label/Piada">Piadas</a></li>

</ul>