2

jQuery Mobileページでは、いくつかのボタンに水平方向のコントロールグループを使用しています。ただし、一部の言語では、これらのボタン内のテキストが長すぎます。

各ボタン内でテキストを折り返す代わりに、ボタン自体が次の行に折り返されます。

問題のスクリーンショット

これは基本コードです：

<div data-role="controlgroup" data-type="horizontal">
    <a href="#pageVertical" data-role="button">short button</a>
    <a href="#pageVertical" data-role="button">really really really insanely long button is really really insanely long. No really, who makes buttons this big?</a>
</div>

そして、このcssを使用して、ボタンの内側にラップするように説得します。それ以外の場合、テキストは省略記号で切り捨てられます

.ui-btn-inner{ 
    white-space: normal !important; 
}

このフィドルの3ページ目には、問題が示されています http://jsfiddle.net/koesper/R8Kwe/

誰かが私がこれにどのように取り組むことができるかについて何か考えがありますか？

よろしくお願いします、キャスパー

ps。元の修正のインスピレーションは、Jquery MobileMultilineButtonのToshから来ました

4

2 に答える 2

4

コントロール グループのリンクの幅を設定できます。

.ui-page .ui-content .ui-controlgroup a {
    width : 49%;
}​

これにより、それらが同じ行に維持されます。ここにデモがあります：http://jsfiddle.net/R8Kwe/6/

また、徹底するために、要素の子である要素white-space : normalに実際に適用する必要があります（したがって、継承された値を引き続き受け取ります）。.ui-btn-text.ui-btn-inner

于 2012-04-17T16:54:11.707 に答える
0

長いボタンを短くする - これは使いやすさの問題です。その長い名前のアクション ボタンがある場合、それはアクションの目的に反しているように思えますか? それ以外では、このような目的でコントロール グループを使用することはありません。カスタム データ テーマといくつかのグリッドを使用して、ボタンをインラインで格納します。

于 2012-04-18T01:59:48.393 に答える