jQuery Mobile的：按鈕文本

Question

的垂直中心兩行我有2行文字與下面的CSS規則的jQuery移動按鈕：

.ui-btn-text { 
    word-wrap: break-word !important; 
    white-space: normal !important; 
} 

jQuery讓與該類跨度：ui-btn-inner ui-btn-corner-all周圍的文本。

我想這個元素是垂直居中。

當我使用vertical-align它沒有效果。 line-height不工作，因爲我的文本可以有兩行。

有沒有人有一個想法如何我可以垂直居中我的文本在按鈕中？

Answer 1

內聯元素（如<SPAN>）只能使用line-height僞造垂直取向。所以如果在這種情況下由於多行而不適合你，請切換到表格/單元格（<TD>）。但是，如果jQuery手機正在生成內部span標籤，那不適合你。

您也可以垂直對齊包裝<TD>而不是使按鈕具有較小的高度，因此文本本身不需要垂直居中。但這意味着視覺設計的變化。

HTML規範不是爲這種佈局設計的。因此，如果上述解決方案在您的情況下無法正常工作，您將放棄嘗試動態垂直對齊內聯元素中的文本，至少通過HTML/CSS解決方案。

非CSS解決方案包括預渲染的圖像，數據綁定後的Javascript調整，HTML5 <CANVAS>或SVG圖像以及其他高級解決方法，如果您只需要垂直對齊的文本，通常不值得冒險。

Answer 2

你應該讓div容器

position: relative; 

，並給它的高度。然後使內部分區

position: absolute; margin: 0px auto; 

使其在容器中垂直居中！

=============
原來的答覆：

text-align: center; 

應該做的伎倆爲水平居中。

Answer 3

嘗試用頂底padding: 10px 0;

Answer 4

我解決了這個問題，把文本放在一個帶有頁邊空白的div裏，當它有2行時它不完美，現在居中，但它應該沒問題。 Thx爲您的建議