Vertical-Align - как это работает?

Question

Так что есть код on JSFidle, и я не могу сделать h1 внутри секции, чтобы быть в середине поля ... вертикальный выравнивание не делает его работу! И маржа автоматически такая же. У Any1 есть идея?

#welcome{ 
    vertical-align: middle; 
    height: 100px; 
} 
#welcome h1{ 
    color: gray; 
    font-size: 2.1em; 
    font-family:"proxima-nova","sans-serif"; 
    text-align: center; 
    font-weight: bold; 
} 

Answer 1

Установить высоту строки по телефону #welcome h1 высота, в которой вы хотите центрировать текст, это типичный способ выравнивания текста по центру.

jsFiddle

#welcome h1 { 
    line-height: 100px; 
} 

Answer 2

Добавить display:table-cell

section{ 
    display:table-cell; 
    vertical-align: middle; 
    position: relative; 
    top:0px; 
    border-bottom: 1px solid #eee; 
} 

DEMO

Answer 3

если установить высоту строки в таком же, как сНе высоты будет вертикальными выравнивать

#welcome{ 
height: 100px; 
} 
#welcome h1{ 
line-height:100px; 
}