I'm trying to create a simple menu with transition. When you click the menu item, it should open with a CSS transition but I'm guessing I'm missing something. My CSS classes are:

```
.container {
    height: 0;
    overflow: hidden;
    transition: all 0.3s;
    -webkit-transition: all 0.6s;
}

.container div {
    font-size: 13px;
    padding: 5px;
}

.ShowSubMenu {
    height: initial !important;
}

```

The ShowSubMenu is applied only when clicking the outer menu item. Please check a working example here: <http://jsfiddle.net/CwmTZ/>

If you switch the height property of the ShowSubMenu to a constant number, the transition will work nicely. The thing is, I don't know how many sub menu items I will have, it must be dynamic. 

Thanks!