0

私はjQueryモバイルアプリに取り組んでおり、リストディバイダー内のボタンの配置を誰かが手伝ってくれるかどうか疑問に思っていました。これは、テキストの横にボタンを表示して作成したjsFiddleへのリンクです。ボタンを右に揃えることは可能かと思いました。のスタイルでボタンの周りにdivを追加しようとしましたが、このstyle="text-align: right;"ようにボタンを押し下げます。これは望ましくありません。

ボタンを右に揃えて、テキストとボタンを同じ行に保持する方法はありますか？どんな助けでも大歓迎です。

4

1 に答える 1

2

2列のレイアウトグリッドを使用してそれを行うことができます。jsfiddleを参照してください。

コード：

<div data-role="page" id="p1">
    <div  data-role="header"><h1>Header Page 1</h1></div>

    <div  data-role="content">
         <ul data-role="listview" data-inset="true" data-divider-theme="a">
           <li data-role="list-divider">
             <div class="ui-bar ui-grid-a">
               <div class="ui-block-a" style="margin-top:10px;">List Header</div>
               <div class="ui-block-b" style="text-align:right;"><a href="#" data-role="button" data-mini="true" data-icon="plus" data-inline="true" data-theme="a">Add</a></div>
             </div>
           </li>
           <li>List item 1</li>
      </ul>
    </div>

    <div  data-role="footer"><h4>Footer</h4></div>
</div>

screenhsot：
ここに画像の説明を入力してください

于 2013-01-08T14:18:37.130 に答える