Вертикальное выравнивание в раскрывающемся меню

Question

Я пытаюсь вертикально выровнять текст в выпадающем меню. Я выполнял предложение в Stackoverflow и использовал display: table-cell и vertical-align: middle, но он, похоже, не работает. Он просто прикрепляет каждый текст вверху каждой выпадающей ячейки.

Мое раскрывающееся меню - #results.

Код и CSS приведены ниже.

<div class="container"> 
    <div id="jumbo" class="jumbotron"> 
    <input type="text" value="" placeholder="Search" id="keyword"> 
    <input type="button" id="myBtn" value="Go"> 
    <div id="results"> 
    <div class="item"></div> 
    <div class="item"></div> 
    <div class="item"></div> 
    </div> 
    <div class="row"> 
    <div class="col-md-12" id="trainstation" style="background-color:blue;width:100%;margin:auto;height:100px;"> 
    </div> 
    <div class="clearfix visible-lg"></div> 
    </div> 
    </div> 
</div> 

CSS

#results { 
    width:94%; 
    position:absolute; 
    margin: 0 auto; 
    left: 0; 
    right: 0; 
    background-color:white; 
    border:1px solid #c0c0c0; 
    display:none; 
    text-align:left; 
    z-index:10000; 
    } 
    #results .item { 
    padding:3px; 
    height:50px; 
    font-family: arial; 
    display:table-cell; 
    vertical-align:middle; 
    border-bottom:1px solid #c0c0c0; 
    } 

EDIT

Извините выше код фактически центрирования все на ОДНОМ line..ie ONE выпадающий со всеми предложениями в том, что один выпадающий

Answer 1

display: block Просто добавьте и используйте line-height для горизонтального центра

CSS

#results { 
    width:94%; 
    position:absolute; 
    margin: 0 auto; 
    left: 0; 
    right: 0; 
    background-color:white; 
    border:1px solid #c0c0c0; 
    text-align:left; 
    z-index:10000; 
    } 
    #results .item { 
    padding:3px; 
    height:50px; 
    font-family: arial; 
    display:block; 
    vertical-align:bottom; 
    border-bottom:1px solid #c0c0c0; 
    line-height: 50px; 
    } 

DEMO HERE

Answer 2

Установите line-height: вашего класса предметов равным высоте div, поэтому примерно

#results .item { 
padding:3px; 
height:50px; 
font-family: arial; 
display:table-cell; 
vertical-align:middle; 
line-height:50px; 
border-bottom:1px solid #c0c0c0; 
}