center vertically the content of a div ( not by line-height )

Question

I have a div which I need to center vertically its content:

Free coffee for all the people who visit my restaurant&l         


        
      

Answer 1

You have to add a second div to achieve this.

    

    Free coffee for all the people who visit my restaurant
    


#coffee {
    display: table;
    width: 300px;
    background-color: red;
}
#coffee .inner{
    vertical-align: middle;   
    display: table-cell;
}

Example: http://jsfiddle.net/2Mb39/12/