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

Question

The following code works well:

<div id="container">
   <p>test</p>
</div>

#container{height:500px;display:table-cell;vertical-align:middle;}

but when the containerelement has the css property:float:left

it cannot work!!

I just want vertical-middle while floating

What good does knowing *why* it doesn't work? What are you actually trying to accomplish? — cimmanon, Jul 17 '13 at 15:30

score 0 · Accepted Answer · answered Jul 17 '13 at 15:31

0

You must set line-height in this case:

line-height:500px

answered Jul 17 '13 at 15:31

Ghilas BELHADJ

but multiple lines content,it doesnot work. – jin Jul 19 '13 at 08:31
[http://css-tricks.com/vertically-center-multi-lined-text/](http://css-tricks.com/vertically-center-multi-lined-text/) – jin Jul 19 '13 at 08:47

1 Answers1