Проблема с вертикальным меню

[aov000]

Вопрос к знающим людям!

Есть вертикальное меню, а где ошибка не могу понять.

Пункт подменю(номер3) должен быть скрыт и при нажатии(номер 2) должен появляться.

<ul class="leftmenu">
   <li><a href="#">номер 1</a></li>
   <li><a href="#">номер 2</a>
   <ul class="podmenu">
   <li><a href="#">номер 3</a></li>
   </ul></li>
   <li><a href="#">номер 1</a></li>
</ul>

ul.leftmenu {
   padding:0;
   margin:0px 0 0 0px;
   list-style: none;
   width: 220px;
} 
ul.leftmenu li {
   float: left;
} 
ul.leftmenu li a, ul.leftmenu li a:visited {
   display: block;
   padding:4px;
   margin-bottom: 1px;
   font-family:Tahoma, Geneva, sans-serif; text-decoration:none;
   color:#94775c;
   background-color:#fff;
   width: 230px;
}
ul.leftmenu li a:active { text-decoration:none; text-align:center;
   color:#C00;
   background-color:#e8e1cb;
}

Где ошибка?

Буду признателен за помощь.

[MacPherson]

<ul>
   <li><a href="#">номер 1</a></li>
   <li><a href="#">номер 2</a>
   <ul>
   <li><a href="#">номер 3</a></li>
   </ul></li>
   <li><a href="#">номер 1</a></li>
</ul>?

ul {
    width: 100px;
    background: #ccc;
    }
li ul {
    display: none;
}
li:hover ul { 
    display: block; 
    background: #fff;
}

http://jsfiddle.net/jPUj8/

[aov000]

<ul>
   <li><a href="#">номер 1</a></li>
   <li><a href="#">номер 2</a>
   <ul>
   <li><a href="#">номер 3</a></li>
   </ul></li>
   <li><a href="#">номер 1</a></li>
</ul>?

ul {
    width: 100px;
    background: #ccc;
    }
li ul {
    display: none;
}
li:hover ul { 
    display: block; 
    background: #fff;
}

http://jsfiddle.net/jPUj8/

MacPherson -Спасибо огромное! Очень даже просто и доходчиво!