Text center in absolute div position

Question

I have the following

<div class="label" style="position: absolute; top: 20px; left: 20px; width: 200px; height: 40px;"> Label Text </div> <div class="label" style="position: absolute; top: 70px; left: 20px; width: 200px; height: 120px;"> Also several lines of Label Text may be included </div> 

How can I vertically align (possibly several lines) the text inside div.label?

I can add innerHTML if necessary, but I cannot change the container (class = "label").

http://jsfiddle.net/austinfrance/CDTk2/ (now a working example)

Answer 1

You can use something along the lines

  <div class="label" style="position: absolute; top: 70px; left: 20px; width: 200px; height: 120px; display: table; vertical-align: middle; border:1px solid #000"> <span style="display: table-cell;vertical-align: middle;"> Also several lines of Label Text may be included </span> 

see http://jsfiddle.net/99F6D/1/

Answer 2

Try the following:

  <div class="label" style="position: absolute; top: 20px; left: 20px; width: 200px; height: 40px;"> <span style="display:inline-block; vertical-align:middle"> Label Text </span> </div> 

Answer 3

This is an old question, but the solution is very simple, because now about div height you just set the linear height with the same css style height value.

and your example should be line-height:40px .

good as