Question

I have a ul tag with height:300px and some li tags inside it.

<ul>
   <li> some text</li>
   <li> some other text</li>
</ul>

I want to position this list at the middle of the ul tag vertically.
I dont want to set posittion:absolute .
I test the css below, but it does not work!

ul{
  height: 300px;
  vertical-align: middle;
}
li{
  margin:auto;
}

please give me some css !

Answer 1

Like this?

CSS

ul {
    height: 300px;
    display: table-cell;
    vertical-align: middle;
    background-color: lime;
}

li {
    display: inline-block;
    background-color: fuchsia;
}​

DEMO

JSFiddle