css - "vertical-align:middle" does not work when apply the container element "float" -

this question has answer here:

• css vertical align not work float 3 answers

the following code works well:

<div id="container">    <p>test</p> </div>  #container{height:500px;display:table-cell;vertical-align:middle;} 

but when containerelement has css property:float:left

it cannot work!!

i want vertical-middle while floating

you must set line-height in case:

line-height:500px