Vertically align 'li' middle in 'ul'

[subbu]

I have a simple unordered list like so:\[code\]<ul class="flavours"> <li>Chocolate</li> <li>Caramel</li> <li>Watermelon</li></ul>\[/code\]\[code\]<ul class="flavours">\[/code\] has a \[code\]min-height\[/code\] of \[code\]200px\[/code\] and it grows as more \[code\]<li>\[/code\] elements are added to the list via jQuery ui drag and drop library.When there is just one or two \[code\]<li>\[/code\] elements in the list, how can I vertically align these in the middle of the whole \[code\]<ul>\[/code\]. So as when the height is \[code\]200px\[/code\] the items would be dead center, horizontally and vertically. Currently they are just positioned center top.