Как получить текст в css для отображения в вертикальной середине

Question

У меня есть этот маленький ящик с текстом внутри, но он застрял в верхней части, я попытался использовать Vertical Align, это не помогло, вот код:

.Letters 
{ 
font-size:24px; 
color: white; 
font-family:Futura, Arial, San-serif; 
height:40px; 
width: 40px; 
margin:2px; 
position:relative; 
top:5px; 
background-color:#3594F0; 
text-align: center; 
float: left; 
display: inline; 
vertical-align:middle; 
} 

jsfiddle ссылка: http://jsfiddle.net/2Hq3s/

мне нужен текст, чтобы быть в абсолютном центре без увеличения текста.

Answer 1

Добавить в .Letters

line-height:40px;  /* Same value as your 'height' */ 
vertical-align:middle; 

DEMO

Answer 2

Использование абсолютного позиционирования

top:50%; 
bottom:50%; 
position:absolute; 

http://jsfiddle.net/2Hq3s/3/

Answer 3

Использование дисплея: Таблица-секционная на родителей, чтобы использовать вертикальное выравнивания свойство Здесь a fiddle

<div class="parent"> 
    <p class="Letters">a</p> 
</div> 

.parent{ 
    background-color:#3594F0; 
    display:table-cell; 
} 

Answer 4

Использование дисплея: стол, стол-клетка, как здесь: http://jsfiddle.net/maximgladkov/MALAj/

HTML

<p class="Letters"> 
    <span>aasdfasd<br/>asdfasdfasdf</span> 
</p> 

CSS

.Letters 
{ 
    font-size:24px; 
    color: white; 
    font-family:Futura, Arial, San-serif; 
    height:400px; 
    width: 400px; 
    margin:2px; 
    position:relative; 
    top:5px; 
    background-color:#3594F0; 
    text-align: center; 
    float: left; 
    display: table; 
} 

.Letters span { 
    display: table-cell; 
    vertical-align: middle; 
}