mobile - グリッドを使用して、JQuery Mobile 要素を同じ行に揃えます

Question

jquery mobile と水平方向に整列する 5 つの HTML 要素があります。ui-grid-d可変幅の 5 列のカスタム グリッド ( ) を使用します。すべて問題ありませんが、要素が完全に整列していません。たとえば、コントロール グループが上に立ち、段落が他のコンポーネントの下に立っています。

私は、モバイル デザインと jQuery Mobile についてはまったくの初心者です。すべての要素を自動的に整列させる方法はありますか?

<div id="alarmsLog" class="ui-grid-d">
      <div class="ui-bar ui-bar-c">
          <div class="ui-block-a">
            <a href="#" data-role="button" data-icon="delete" data-iconpos="notext">Image</a>
          </div>
          <div class="ui-block-b">
            <div data-role="controlgroup" data-type="horizontal" >
                <a href="#" data-role="button" data-icon="arrow-l" data-iconpos="notext">Left</a>
                <a href="#" data-role="button" data-icon="arrow-r" data-iconpos="notext">Right</a>
            </div>
          </div>
          <div class="ui-block-c">
            <p>1 di 2</p>
          </div>
          <div class="ui-block-d">
            <input type="text" name="alarmText" id="alarmText" value="Allarme 1"  />
          </div>
          <div class="ui-block-e">
            <a href="#" data-role="button" data-icon="delete" data-iconpos="notext">Delete</a>
          </div>
      </div>
</div>