jquery - jQueryボタンのテキストを垂直方向に揃える方法は?

Question

クラスの高さを少し変更しましたui-buttonが、テキスト ボタンはその下部に残ります。どうすれば真ん中に合わせることができますか？

.ui-button {
   display: inline-block;
   position: relative;
   padding: 0px;
   margin-right: 0.1em;
   cursor: pointer;
   text-align: center;
   overflow: visible;
   // resize a bit the height
   height: 20px;
}

vertical-alignうまくいきませんでした。

http://jsfiddle.net/PM4T6/

Answer 1

.ui-button {line-height: 20px;}

Answer 2

これを試して

.ui-button {
   display: table-cell;
   position: relative;
   padding: 0px;
   margin-right: 0.1em;
   cursor: pointer;
   text-align: center;
   overflow: visible;
   height: 50px;
}

Answer 3

を使用する場合は、position必ずtop left, bottom right....を指定してください。